年度经营预算掉接口

src/api/modules/program/annual.js

@@ -0,0 +1,36 @@
+import {httpApi} from "../../request/httpApi";
+
+export default {
+    //年度经营预算列表
+    async getPage(form, msg = true) {
+        return httpApi({
+            url: '/api/blade-control/annualBudget/page',
+            method: 'get',
+            params: form
+        }, msg);
+    },
+    //查询预览
+    async getPreview(form, msg = true) {
+        return httpApi({
+            url: '/api/blade-control/annualBudget/preview',
+            method: 'get',
+            params: form
+        }, msg);
+    },
+    //删除
+    async deleteAnnualBudget(form, msg = true) {
+        return httpApi({
+            url: '/api/blade-control/annualBudget/deleteAnnualBudget',
+            method: 'get',
+            params: form
+        }, msg);
+    },
+    //单个详情
+    async getAnnualBudget(form, msg = true) {
+        return httpApi({
+            url: '/api/blade-control/annualBudget/getAnnualBudget',
+            method: 'get',
+            params: form
+        }, msg);
+    },
+}

src/views/program/annual/form.vue

@@ -11,33 +11,33 @@
                     </el-form-item>
                 </div>
                 <div>
-                    <el-form-item label="合同" prop="key1">
+                    <el-form-item label="合同" prop="annualContractTarget">
                         <el-tooltip content="年度合同指标">
-                            <el-input v-model="formModel.key1" placeholder="年度合同指标" disabled/>
+                            <el-input v-model="formModel.annualContractTarget" placeholder="年度合同指标" disabled/>
                         </el-tooltip>
                     </el-form-item>
-                    <el-form-item label="利润" prop="key2">
+                    <el-form-item label="利润" prop="annualProfitTarget">
                         <el-tooltip content="年度利润指标">
-                            <el-input v-model="formModel.key2" placeholder="年度利润指标" disabled/>
+                            <el-input v-model="formModel.annualProfitTarget" placeholder="年度利润指标" disabled/>
                         </el-tooltip>
                     </el-form-item>
-                    <el-form-item label="预算" prop="key3">
+                    <el-form-item label="预算" prop="totalBudget">
                         <el-tooltip content="总经营预算">
-                            <el-input v-model="formModel.key3" placeholder="总经营预算" disabled>
+                            <el-input v-model="formModel.totalBudget" placeholder="总经营预算" disabled>
                                 <template #append>元</template>
                             </el-input>
                         </el-tooltip>
                     </el-form-item>
-                    <el-form-item label="工资" prop="key4">
+                    <el-form-item label="工资" prop="staffCost">
                         <el-tooltip content="人员成本">
-                            <el-input v-model="formModel.key4" placeholder="人员成本" disabled>
+                            <el-input v-model="formModel.staffCost" placeholder="人员成本" disabled>
                                 <template #append>元</template>
                             </el-input>
                         </el-tooltip>
                     </el-form-item>
-                    <el-form-item label="综合" prop="key5">
+                    <el-form-item label="综合" prop="manageDisburse">
                         <el-tooltip content="管理支出">
-                            <el-input v-model="formModel.key5" placeholder="管理支出" disabled>
+                            <el-input v-model="formModel.manageDisburse" placeholder="管理支出" disabled>
                                 <template #append>元</template>
                             </el-input>
                         </el-tooltip>
@@ -48,33 +48,32 @@
         <div class="hc-program-annual-form-tabs" :style="tabsStyle">
             <el-tabs type="border-card" class="form-tabs">
                 <el-tab-pane label="年度预算收入">
-                    <HcTable :isIndex="false" :column="tableColumn" :datas="tableData">
-                        <template #key1="{row,index}">
-                            <el-select v-model="row.key1">
-                                <el-option label="选项1" value="选项1"/>
-                                <el-option label="选项2" value="选项2"/>
+                    <HcTable :isIndex="false" :column="tableColumn" :datas="formModel.incomeList">
+                        <template #projectId="{row,index}">
+                            <el-select v-model="row.projectId">
+                                <el-option v-for="item in projectData" :label="item.projectName" :value="item.projectId"/>
                             </el-select>
                         </template>
-                        <template #key2="{row,index}">
-                            <el-select v-model="row.key2">
-                                <el-option label="选项1" value="选项1"/>
-                                <el-option label="选项2" value="选项2"/>
+                        <template #incomeType="{row,index}">
+                            <el-select v-model="row.incomeType">
+                                <el-option v-for="item in incomeTypeData" :label="item.dictName" :value="item.dictValue"/>
+                                
                             </el-select>
                         </template>
-                        <template #key3="{row,index}">
-                            <el-input v-model="row.key3" disabled/>
+                        <template #projectTypeValue="{row,index}">
+                            <el-input v-model="row.projectTypeValue" disabled/>
                         </template>
-                        <template #key4="{row,index}">
-                            <el-input v-model="row.key4" disabled/>
+                        <template #contractTypeValue="{row,index}">
+                            <el-input v-model="row.contractTypeValue" disabled/>
                         </template>
-                        <template #key5="{row,index}">
-                            <el-date-picker class="block" v-model="row.key5" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD"/>
+                        <template #predictSignDate="{row,index}">
+                            <el-date-picker class="block" v-model="row.predictSignDate" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD"/>
                         </template>
-                        <template #key6="{row,index}">
-                            <el-input v-model="row.key6"/>
+                        <template #predictContractMoney="{row,index}">
+                            <el-input v-model="row.predictContractMoney"/>
                         </template>
-                        <template #key7="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #predictAnnualReturned="{row,index}">
+                            <el-input v-model="row.predictAnnualReturned"/>
                         </template>
                         <template #action="{row,index}">
                             <el-button size="small" type="primary">
@@ -89,54 +88,52 @@
                     </HcTable>
                 </el-tab-pane>
                 <el-tab-pane label="年度预算支出">
-                    <HcTable :isIndex="false" :column="tableColumn1" :datas="tableData2">
-                        <template #key1="{row,index}">
-                            <el-select v-model="row.key1">
-                                <el-option label="选项1" value="选项1"/>
-                                <el-option label="选项2" value="选项2"/>
+                    <HcTable :isIndex="false" :column="tableColumn1" :datas="formModel.disburseList">
+                        <template #budgetSubject="{row,index}">
+                            <el-select v-model="row.budgetSubject">
+                                <el-option v-for="item in budgetTypeList" :label="item.dictName" :value="item.dictValue"/>
                             </el-select>
                         </template>
-                        <template #key2="{row,index}">
-                            <el-select v-model="row.key2">
-                                <el-option label="选项1" value="选项1"/>
-                                <el-option label="选项2" value="选项2"/>
+                        <template #secondSubject="{row,index}">
+                            <el-select v-model="row.secondSubject" :getdata="getsecondBudgetTypeList(row.budgetSubject,index)">
+                                <el-option v-for="item in secondBudgetTypeList[index]" :label="item.dictName" :value="item.dictValue"/>
                             </el-select>
                         </template>
-                        <template #key3="{row,index}">
-                            <el-input v-model="row.key3"/>
+                        <template #january="{row,index}">
+                            <el-input v-model="row.january"/>
                         </template>
-                        <template #key4="{row,index}">
-                            <el-input v-model="row.key4"/>
+                        <template #february="{row,index}">
+                            <el-input v-model="row.february"/>
                         </template>
-                        <template #key5="{row,index}">
-                            <el-input v-model="row.key4"/>
+                        <template #march="{row,index}">
+                            <el-input v-model="row.march"/>
                         </template>
-                        <template #key6="{row,index}">
-                            <el-input v-model="row.key6"/>
+                        <template #april="{row,index}">
+                            <el-input v-model="row.april"/>
                         </template>
-                        <template #key7="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #may="{row,index}">
+                            <el-input v-model="row.may"/>
                         </template>
-                        <template #key8="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #june="{row,index}">
+                            <el-input v-model="row.june"/>
                         </template>
-                        <template #key9="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #july="{row,index}">
+                            <el-input v-model="row.july"/>
                         </template>
-                        <template #key10="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #august="{row,index}">
+                            <el-input v-model="row.august"/>
                         </template>
-                        <template #key11="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #september="{row,index}">
+                            <el-input v-model="row.september"/>
                         </template>
-                        <template #key12="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #october="{row,index}">
+                            <el-input v-model="row.october"/>
                         </template>
-                        <template #key13="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #november="{row,index}">
+                            <el-input v-model="row.november"/>
                         </template>
-                        <template #key14="{row,index}">
-                            <el-input v-model="row.key7"/>
+                        <template #december="{row,index}">
+                            <el-input v-model="row.december"/>
                         </template>
                         <template #action="{row,index}">
                             <el-button size="small" type="primary">
@@ -166,17 +163,95 @@
 </template>
 
 <script setup>
-import {nextTick, onActivated, ref, onDeactivated} from "vue";
-import {useRouter} from 'vue-router'
-
+import {nextTick, onActivated, ref, onDeactivated,watch} from "vue"
+import {useRouter, useRoute} from 'vue-router'
+import annualApi from '~api/program/annual.js';
+import costApi from '~api/project/cost.js';
+import {getChildList} from '~api/system/parameter.js';
+import {getArrValue,getObjValue} from "js-fast-way"
+import {getProjectList, getDictInfo} from "~api/other";
 const router = useRouter()
-
+const useRoutes = useRoute()
+const dataId = ref(useRoutes?.query?.id ?? '')
+const dataType = ref(useRoutes?.query?.type ?? '')
 //页面激活
 onActivated(() => {
     setFormTabsStyle()
     windowResize()
+    getDetail()
+    getProjectData()
+    getIncomeType()
+    getBudgetTypeList()
 })
 
+const getDetail = async() => {
+    const {error, code, data} = await annualApi.getAnnualBudget({id:dataId.value})
+    if (!error && code === 200) {
+        console.log(data,'data');
+        formModel.value=getObjValue(data)
+  
+        betweenTime.value[0]=data['budgetStartTime']
+        betweenTime.value[1]=data['budgetEndTime']
+    } else {
+        formModel.value={}
+    }
+}
+
+//获取项目数据
+const projectData = ref([])
+const getProjectData = async () => {
+    const {error, code, data} = await getProjectList()
+    //判断状态
+    if (!error && code === 200) {
+        projectData.value = getArrValue(data)
+    } else {
+        projectData.value = []
+    }
+}
+//收入类型字典
+const incomeTypeData = ref([])
+const getIncomeType = async () => {
+    const {error, code, data} = await getDictInfo('project_income_type')
+    //判断状态
+    if (!error && code === 200) {
+        incomeTypeData.value = getArrValue(data)
+    } else {
+        incomeTypeData.value = []
+    }
+}
+//获取预算分类getSecondSubject
+const budgetTypeList=ref([])
+const getBudgetTypeList=async()=>{
+    const {error, code, data} = await costApi.getSecondSubject()
+    if (!error && code === 200) {
+        budgetTypeList.value=getArrValue(data)
+     
+
+    } else {
+        budgetTypeList.value={}
+    }
+}
+const secondBudgetTypeList=ref({})
+const getsecondBudgetTypeList=async(val,index)=>{
+    let id=''
+    budgetTypeList.value.forEach((ele)=>{
+        if(ele.dictValue===val){
+            id=ele.id
+        }
+    })
+    if(id.length>0){
+        const {error, code, data} = await costApi.getChlidList({parentId:id,type:1})
+        if (!error && code === 200) {
+            secondBudgetTypeList.value[index]=getArrValue(data)
+        } else {
+            secondBudgetTypeList.value[index]=[]
+           
+        }
+    }
+   
+}
+
+
 //设置表单tabs样式
 const tabsStyle = ref('')
 const setFormTabsStyle = () => {
@@ -195,7 +270,7 @@ const formModel = ref({
 const formRules = {}
 
 //日期时间被选择
-const betweenTime = ref(null)
+const betweenTime = ref([])
 const betweenTimeUpdate = ({arr, query}) => {
     betweenTime.value = arr
     //formModel.value.betweenTime = query
@@ -213,13 +288,13 @@ const resizeEvent = () => {
 
 //获取数据
 const tableColumn = [
-    {key: 'key1', name: '项目名称', minWidth: '180', align: 'center'},
-    {key: 'key2', name: '收入类别', width: '180', align: 'center'},
-    {key: 'key3', name: '项目类别', width: '180', align: 'center'},
-    {key: 'key4', name: '产品线', width: '180', align: 'center'},
-    {key: 'key5', name: '预计签单时间', width: '220', align: 'center'},
-    {key: 'key6', name: '预计新签合同额', width: '180', align: 'center'},
-    {key: 'key7', name: '预计本年度回款额', width: '180', align: 'center'},
+    {key: 'projectId', name: '项目名称', minWidth: '180', align: 'center'},
+    {key: 'incomeType', name: '收入类别', width: '180', align: 'center'},
+    {key: 'projectTypeValue', name: '项目类别', width: '180', align: 'center'},
+    {key: 'contractTypeValue', name: '产品线', width: '180', align: 'center'},
+    {key: 'predictSignDate', name: '预计签单时间', width: '220', align: 'center'},
+    {key: 'predictContractMoney', name: '预计新签合同额', width: '180', align: 'center'},
+    {key: 'predictAnnualReturned', name: '预计本年度回款额', width: '180', align: 'center'},
     {key: 'action', name: '操作', width: '170', align: 'center', fixed: 'right'},
 ]
 const tableData = ref([
@@ -227,20 +302,20 @@ const tableData = ref([
 ])
 
 const tableColumn1 = [
-    {key: 'key1', name: '预算科目（一级）', minWidth: '180', align: 'center'},
-    {key: 'key2', name: '二级科目', minWidth: '180', align: 'center'},
-    {key: 'key3', name: '1月', width: '100', align: 'center'},
-    {key: 'key4', name: '2月', width: '100', align: 'center'},
-    {key: 'key5', name: '3月', width: '100', align: 'center'},
-    {key: 'key6', name: '4月', width: '100', align: 'center'},
-    {key: 'key7', name: '5月', width: '100', align: 'center'},
-    {key: 'key8', name: '6月', width: '100', align: 'center'},
-    {key: 'key9', name: '7月', width: '100', align: 'center'},
-    {key: 'key10', name: '8月', width: '100', align: 'center'},
-    {key: 'key11', name: '9月', width: '100', align: 'center'},
-    {key: 'key12', name: '10月', width: '100', align: 'center'},
-    {key: 'key13', name: '11月', width: '100', align: 'center'},
-    {key: 'key14', name: '12月', width: '100', align: 'center'},
+    {key: 'budgetSubject', name: '预算科目（一级）', minWidth: '180', align: 'center'},
+    {key: 'secondSubject', name: '二级科目', minWidth: '180', align: 'center'},
+    {key: 'january', name: '1月', width: '100', align: 'center'},
+    {key: 'february', name: '2月', width: '100', align: 'center'},
+    {key: 'march', name: '3月', width: '100', align: 'center'},
+    {key: 'april', name: '4月', width: '100', align: 'center'},
+    {key: 'may', name: '5月', width: '100', align: 'center'},
+    {key: 'june', name: '6月', width: '100', align: 'center'},
+    {key: 'july', name: '7月', width: '100', align: 'center'},
+    {key: 'august', name: '8月', width: '100', align: 'center'},
+    {key: 'september', name: '9月', width: '100', align: 'center'},
+    {key: 'october', name: '10月', width: '100', align: 'center'},
+    {key: 'november', name: '11月', width: '100', align: 'center'},
+    {key: 'december', name: '12月', width: '100', align: 'center'},
     {key: 'action', name: '操作', width: '170', align: 'center', fixed: 'right'},
 ]
 const tableData2 = ref([

src/views/program/annual/index.vue

@@ -1,12 +1,12 @@
 <template>
     <HcCard>
-        <template #header>
+        <!-- <template #header>
             <div class="w-36">
                 <el-select v-model="searchForm.planType" block clearable placeholder="年度" size="large">
                     <el-option v-for="item in planType" :label="item.name" :value="item.key"/>
                 </el-select>
             </div>
-        </template>
+        </template> -->
         <template #extra>
             <el-button size="large" type="primary" hc-btn @click="addRowClick">
                 <HcIcon name="add"/>
@@ -14,12 +14,17 @@
             </el-button>
         </template>
         <HcTable :column="tableColumn" :datas="tableData" :loading="tableLoading">
-            <template #key1="{row}">
-                <span class="text-blue" @click="rowNameClick(row)">{{row.key1}}</span>
+            <template #name="{row}">
+                <span class="text-blue" @click="rowNameClick(row)">{{row.name}}</span>
+            </template>
+            <template #key2="{row}">
+                <span >{{row.budgetStartTime?row.budgetStartTime:''}}</span>
+                <span  v-if="row.budgetEndTime">~</span>
+                <span >{{row.budgetEndTime?row.budgetEndTime:''}}</span>
             </template>
             <template #action="{row,index}">
                 <el-button plain size="small" type="primary" @click="editRowClick(row)">编辑</el-button>
-                <el-button plain size="small" type="danger">删除</el-button>
+                <el-button plain size="small" type="danger" @click="rowCancel(row)">删除</el-button>
             </template>
         </HcTable>
         <template #action>
@@ -29,11 +34,19 @@
 </template>
 
 <script setup>
-import {ref} from "vue";
-import {useRouter} from 'vue-router'
+import {ref,onMounted} from "vue";
+import annualApi from '~api/program/annual.js';
+import {getArrValue} from "js-fast-way"
+import {delMessage} from "~uti/tools";
+import {useRouter, useRoute} from 'vue-router'
 
 const router = useRouter()
 
+onMounted(()=>{
+    getTableData()
+  
+})
+
 //计划类型
 const planType = ref([
     {name: '临时计划', key: '1'},
@@ -56,14 +69,14 @@ const pageChange = ({current, size}) => {
 //获取数据
 const tableLoading = ref(false)
 const tableColumn = [
-    {key: 'key1', name: '预算名称'},
+    {key: 'name', name: '预算名称'},
     {key: 'key2', name: '起止日期', width: '220', align: 'center'},
-    {key: 'key3', name: '总经营预算', width: '120', align: 'center'},
-    {key: 'key4', name: '年度合同额指标', width: '140', align: 'center'},
-    {key: 'key5', name: '年度利润指标', width: '120', align: 'center'},
-    {key: 'key6', name: '工资支出', width: '120', align: 'center'},
-    {key: 'key7', name: '其他管理支出', width: '120', align: 'center'},
-    {key: 'action', name: '操作', width: '130', align: 'center'},
+    {key: 'totalBudget', name: '总经营预算', width: '120', align: 'center'},
+    {key: 'annualContractTarget', name: '年度合同额指标', width: '140', align: 'center'},
+    {key: 'annualProfitTarget', name: '年度利润指标', width: '120', align: 'center'},
+    {key: 'staffCost', name: '工资支出', width: '120', align: 'center'},
+    {key: 'manageDisburse', name: '其他管理支出', width: '120', align: 'center'},
+    {key: 'action', name: '操作', width: '150', align: 'center'},
 ]
 const tableData = ref([
     {id: 1, key1: '2023年5月度计划', key2: '2022-07-01~2027-04-12', key3: '111',  key4: '36', key5: '30', key6: '6', key7: '张三'},
@@ -72,21 +85,37 @@ const tableData = ref([
     {id: 4, key1: '2023年5月度计划', key2: '2022-07-01~2027-04-12', key3: '111',  key4: '36', key5: '30', key6: '6', key7: '张三'},
 ])
 
-const getTableData = () => {
-
+const getTableData = async() => {
+    tableLoading.value = true
+    const {error, code, data} = await annualApi.getPage(searchForm.value)
+    tableLoading.value = false
+    if (!error && code === 200) {
+        tableData.value = getArrValue(data['records'])
+        searchForm.value.total = data['total'] || 0
+    } else {
+        tableData.value = []
+        searchForm.value.total = 0
+    }
 }
 
 //名称被点击
 const rowNameClick = (row) => {
     router.push({
-        name: 'program-annual-view'
+        name: 'program-annual-view',
+        query: {
+            id: row.id,
+            name:row.name
+        }
     })
 }
 
 //新增计划
 const addRowClick = () => {
     router.push({
-        name: 'program-annual-form'
+        name: 'program-annual-form',
+        query:{
+            type:'add'
+        }
     })
 }
 
@@ -95,7 +124,23 @@ const editRowClick = (row) => {
     router.push({
         name: 'program-annual-form',
         query: {
+            id: row.id,
+            type:'edit'
+        }
+    })
+}
+//删除
+const rowCancel = (row) => {
+    delMessage(async () => {
+        const {error, code, msg} = await annualApi.deleteAnnualBudget({
             id: row.id
+        })
+        //判断状态
+        if (!error && code === 200) {
+            window.$message?.success(msg)
+            getTableData().then()
+        } else {
+            window.$message?.error(msg)
         }
     })
 }

src/views/program/annual/view.vue

@@ -1,7 +1,7 @@
 <template>
     <HcCard>
         <template #header>
-            <span class="text-blue font-bold text-lg">2023年年度经营预算表</span>
+            <span class="text-blue font-bold text-lg">{{ name }}</span>
         </template>
         <template #extra>
             <el-button @click="goBackClick">
@@ -20,7 +20,7 @@
                     <template v-for="item in tableColumn">
                         <el-table-column :prop="item.key" :label="item.name" align="center">
                             <template #default="{ row, $index }">
-                                <span class="num-span" v-if="$index !== 2" @click="numSpanClick(item.key, $index)">{{row[item.key]}}</span>
+                                <span class="num-span" v-if="$index !== 2" @click="numSpanClick(item, $index,row)">{{row[item.key]}}</span>
                                 <span class="total-span" v-else>{{row[item.key]}}</span>
                             </template>
                         </el-table-column>
@@ -43,10 +43,15 @@
 </template>
 
 <script setup>
-import {ref} from "vue";
-import {useRouter} from 'vue-router'
+import {ref,onActivated} from "vue";
+import {useRoute, useRouter} from 'vue-router'
+import annualApi from '~api/program/annual.js';
+import {getArrValue,getObjValue} from "js-fast-way"
 
 const router = useRouter()
+const useRoutes = useRoute()
+const dataId = ref(useRoutes?.query?.id ?? '')
+const name = ref(useRoutes?.query?.name ?? '')
 
 //获取数据
 const tableLoading = ref(false)
@@ -62,25 +67,62 @@ const tableColumn = [
     {key: 'key9', name: '9月'},
     {key: 'key10', name: '10月'},
     {key: 'key11', name: '11月'},
-    {key: 'key12', name: '12月'}
+    {key: 'key12', name: '12月'},
+
+    
+  
+
 ]
 const tableData = ref([
     {id: 1, key: '收入', key1: '10000', key2: '20000',  key3: '36', key4: '30', key5: '6'},
     {id: 2, key: '支出', key1: '10000', key2: '20000',  key3: '36', key4: '30', key5: '6'},
     {id: 3, key: '月总计', key1: '+10000', key2: '-20000',  key3: '+36', key4: '-30', key5: '-6'}
 ])
-
+const getTableData = async() => {
+    tableLoading.value = true
+    const {error, code, data} = await annualApi.getPreview({id:dataId.value})
+    tableLoading.value = false
+    if (!error && code === 200) {
+        let monthDisburseObj=tableData.value[1]
+        let monthDisburse=data.monthDisburse
+        monthDisburse.forEach((ele,index) => {
+            monthDisburseObj['key'+parseInt(index+1)]=ele.disburse
+            monthDisburseObj['disburseList'+'key'+parseInt(index+1)]=ele.disburseList
+        });
+        let incomeObj=tableData.value[0]
+        let monthIncome=data.monthIncome
+        monthIncome.forEach((ele,index) => {
+            incomeObj['key'+parseInt(index+1)]=ele.income
+            incomeObj['incomeList'+'key'+parseInt(index+1)]=ele.incomeList
+        });
+        let monthTotalObj=tableData.value[2]
+        let monthTotal=data.monthTotal
+        monthTotal.forEach((ele,index) => {
+            monthTotalObj['key'+parseInt(index+1)]=ele
+        });
+    } else {
+        tableData.value = []
+    }
+}
+//缓存页面被激活时
+onActivated(() => {
+    getTableData()
+   
+})
 //自定义表头样式
 const tableHeaderCellStyle = () => {
     return {backgroundColor: 'rgba(64, 149, 229, 0.36)', color: '#101010'}
 }
 
 //名称被点击
-const numSpanClick = (key, index) => {
+const numSpanClick = (item, index,row) => {
     if (index === 0) {  //收入
         incomeModal.value = true
+        tableIncomeData.value=row['incomeList'+item.key]
     } else if (index === 1) {   //支出
         expendModal.value = true
+        tableExpendData.value=row['disburseList'+item.key]
+        console.log(row['disburseList'+item.key]);
     }
 }
 
@@ -91,13 +133,13 @@ const incomeCloseClick = () => {
 }
 //收入详情表格
 const tableIncomeColumn = [
-    {key: 'key1', name: '项目名称'},
-    {key: 'key2', name: '收入类别',  align: 'center'},
-    {key: 'key3', name: '项目类别', align: 'center'},
-    {key: 'key4', name: '产品线', align: 'center'},
-    {key: 'key5', name: '预计签单时间', align: 'center'},
-    {key: 'key6', name: '预计新签合同额', align: 'center'},
-    {key: 'key7', name: '预计本年度回款总金额', align: 'center'},
+    {key: 'projectName', name: '项目名称'},
+    {key: 'incomeTypeValue', name: '收入类别',  align: 'center'},
+    {key: 'projectTypeValue', name: '项目类别', align: 'center'},
+    {key: 'predictContractMoney', name: '产品线', align: 'center'},
+    {key: 'predictSignDate', name: '预计签单时间', align: 'center'},
+    {key: 'predictAnnualReturned', name: '预计新签合同额', align: 'center'},
+    {key: 'predictAnnualReturned', name: '预计本年度回款总金额', align: 'center'},
 ]
 const tableIncomeData = ref([
     {id: 1, key1: 'xxxx'},
@@ -114,9 +156,9 @@ const expendCloseClick = () => {
 }
 //支出详情表格
 const tableExpendColumn = [
-    {key: 'key1', name: '预算科目(一级)',  align: 'center'},
-    {key: 'key2', name: '二级科目',  align: 'center'},
-    {key: 'key3', name: '当月', align: 'center'},
+    {key: 'budgetSubjectValue', name: '预算科目(一级)',  align: 'center'},
+    {key: 'secondSubjectValue', name: '二级科目',  align: 'center'},
+    {key: 'currentMonthMoney', name: '当月', align: 'center'},
 ]
 const tableExpendData = ref([
     {id: 1, key1: 'xxxx'},

src/views/project/cost/form.vue

@@ -65,13 +65,13 @@
                          </el-select>
                     </template>
                     <template #budgetType="{row,index}">
-                        <el-select v-model="row.budgetType" @change="budgetTypeChange">
+                        <el-select v-model="row.budgetType">
                             <el-option v-for="item in budgetTypeList" :label="item.dictName" :value="item.dictValue"/>
                         </el-select>
                     </template>
                     <template #taskDetail="{row,index}">
-                        <el-select v-model="row.taskDetail">
-                            <el-option v-for="item in taskDetailList" :label="item.dictName" :value="item.dictValue"/>
+                        <el-select v-model="row.taskDetail" :getdata="budgetTypeChange(row?.budgetType,index)">
+                            <el-option v-for="item in taskDetailList[index]" :label="item.dictName" :value="item.dictValue"/>
                         </el-select>
                     </template>
                     <template #budgetDays="{row,index}">
@@ -226,21 +226,24 @@ const getBudgetTypeList=async()=>{
     }
 }
 //任务明细
-const taskDetailList=ref([])
-const budgetTypeChange=async(val)=>{
+const taskDetailList=ref({})
+const budgetTypeChange=async(val,index)=>{
     let id=''
     budgetTypeList.value.forEach((ele)=>{
         if(ele.dictValue===val){
             id=ele.id
         }
     })
-    const {error, code, data} = await costApi.getChlidList({parentId:id,type:1})
-    if (!error && code === 200) {
-        taskDetailList.value=getArrValue(data)
+    if(id.length>0){
+        const {error, code, data} = await costApi.getChlidList({parentId:id,type:1})
+        if (!error && code === 200) {
+            taskDetailList.value[index]=getArrValue(data)
 
-    } else {
-        taskDetailList.value={}
+        } else {
+            taskDetailList.value[index]={}
+        }
     }
+   
 }
 //获取岗位分类postTypeList
 const postTypeList=ref([])
@@ -357,15 +360,7 @@ const tableColumn = [
     {key: 'action', name: '操作', width: '200', align: 'center', fixed: 'right'},
 ]
 const tableData = ref([{}])
-//深度监听
-watch(() => [
-  tableData.value,
-], ([data]) => {
-   if(data!=={}&&data.length>0){
-    budgetTypeChange(data[0].budgetType)
-   }
-//    
-}, {deep: true})
+
 const originTableData=ref([ {}])
 const addRow=()=>{
     tableData.value.push({})