月度

src/views/components/ProjectDetails/Companyenter.vue

@@ -420,7 +420,7 @@ export default {
 .block {
   width: 98%;
   display: flex;
-  justify-content: space-between;
+  justify-content: right;
   margin-top: 1rem;
 }
 </style>

src/views/components/ProjectDetails/Months.vue

@@ -24,19 +24,22 @@
           </el-table-column>
           <el-table-column prop="monthlyInvestment" label="当月完成投资" width="220" align="center">
             <template slot-scope="scope">
-              <el-input v-if="scope.row.isEditing" v-model.number="scope.row.monthlyInvestment" style="width: 100%;"></el-input>
+              <el-input v-if="scope.row.isEditing" v-model.number="scope.row.monthlyInvestment"
+                style="width: 100%;"></el-input>
               <span v-else>{{ scope.row.monthlyInvestment }}</span>
             </template>
           </el-table-column>
           <el-table-column prop="cumulativeInvestment" label="累计完成投资" width="280" align="center">
             <template slot-scope="scope">
-              <el-input v-if="scope.row.isEditing" v-model.number="scope.row.cumulativeInvestment" style="width: 100%;"></el-input>
+              <el-input v-if="scope.row.isEditing" v-model.number="scope.row.cumulativeInvestment"
+                style="width: 100%;"></el-input>
               <span v-else>{{ scope.row.cumulativeInvestment }}</span>
             </template>
           </el-table-column>
           <el-table-column prop="cumulativeArea" label='截止目前累计建成面积(平方米)' width="280" align="center">
             <template slot-scope="scope">
-              <el-input v-if="scope.row.isEditing" v-model.number="scope.row.cumulativeArea" style="width: 100%;"></el-input>
+              <el-input v-if="scope.row.isEditing" v-model.number="scope.row.cumulativeArea"
+                style="width: 100%;"></el-input>
               <span v-else>{{ scope.row.cumulativeArea }}</span>
             </template>
           </el-table-column>
@@ -48,15 +51,18 @@
           </el-table-column>
           <el-table-column label="操作" width="200" align="center">
             <template slot-scope="scope">
-              <el-button v-if="scope.row.isEditing" size="mini" type="text" icon="el-icon-check" @click="handleSave(scope.row)">保存</el-button>
-              <el-button v-else size="mini" type="text" icon="el-icon-edit" @click="handleEdit(scope.row)">编辑</el-button>
-              <el-button size="mini" type="text" icon="el-icon-delete" style="color: #F25353;" @click="handleDelete(scope.row)">删除</el-button>
+              <el-button v-if="scope.row.isEditing" size="mini" type="text" icon="el-icon-check"
+                @click="handleSave(scope.row)">保存</el-button>
+              <el-button v-else size="mini" type="text" icon="el-icon-edit"
+                @click="handleEdit(scope.row)">编辑</el-button>
+              <el-button size="mini" type="text" icon="el-icon-delete" style="color: #F25353;"
+                @click="handleDelete(scope.row)">删除</el-button>
             </template>
           </el-table-column>
         </el-table>
         <div class="block">
           <div style="visibility: hidden;"></div>
-          <el-pagination :current-page="currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="pageSize"
+          <el-pagination :current-page="current" :page-sizes="[10, 20, 30, 40]" :page-size="size"
             layout="total, prev, pager, next, jumper" :total="total">
           </el-pagination>
         </div>
@@ -66,24 +72,46 @@
 </template>
 
 <script>
+import { getMonthInformationPage } from "@/api/ManageApi/index";
+
 export default {
+  props: {
+    action: {
+      type: String,
+      required: true,
+    },
+    xmId: {
+      type: Number,
+      required: true,
+    },
+  },
   data() {
     return {
       tableData: [
-
+        {
+          month: '2024-10',
+          status: '未更新',
+          monthlyInvestment: 0,
+          cumulativeInvestment: 0,
+          cumulativeArea: 0,
+          progressDetails: '暂无数据',
+          isEditing: false,
+        },
       ],
-      currentPage: 1,
-      pageSize: 10,
+      current: 1,
+      size: 10,
       total: 0,
-    }
+    };
   },
   methods: {
     getStatusColor(status) {
       switch (status) {
-        case '未更新':
-          return 'color: #2DD29F;';
-        case '已更新':
-          return 'color: #2B62F1;';
+        case "未更新":
+          return "color: #2DD29F;";
+        case "已更新":
+          return "color: #2B62F1;";
+        default:
+          return ""; 
       }
     },
     handleEdit(row) {
@@ -91,38 +119,60 @@ export default {
     },
     handleSave(row) {
       row.isEditing = false;
-      // 实现保存逻辑，例如调用后端API保存数据
-      console.log('保存:', row);
+      console.log("保存:", row);
       this.$message({
-        type: 'success',
-        message: '保存成功!'
+        type: "success",
+        message: "保存成功!",
       });
     },
     handleDelete(row) {
-      this.$confirm('你确定要删除此条记录吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        console.log('删除:', row);
-        // 实现删除逻辑
-        const index = this.tableData.indexOf(row);
-        if (index !== -1) {
-          this.tableData.splice(index, 1);
-        }
-        this.$message({
-          type: 'success',
-          message: '删除成功!'
+      this.$confirm("你确定要删除此条记录吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          console.log("删除:", row);
+          // 确保 tableData 是数组
+          if (Array.isArray(this.tableData)) {
+            const index = this.tableData.indexOf(row);
+            if (index !== -1) {
+              this.tableData.splice(index, 1);
+            }
+          }
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
         });
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        });
-      });
-    }
-  }
-}
+    },
+    async getMonthInformationPage() {
+      try {
+        const response = await getMonthInformationPage({ xmId: this.xmId });
+        // 确保 response.data.records 是数组
+        if (Array.isArray(response.data.records) && response.data.records.length > 0) {
+          this.tableData = response.data.records; 
+          this.total = response.data.total || 0;
+        } else {
+          // 如果后端返回的数据为空数组，保留默认数据
+          this.total = 0;
+        }
+      } catch (error) {
+        console.error("获取月度进展信息失败:", error);
+        this.$message.error("获取月度进展信息失败");
+      }
+    },
+  },
+  created() {
+    this.getMonthInformationPage();
+  },
+};
 </script>
 
 <style scoped>

src/views/manage-add/index.vue

@@ -46,7 +46,7 @@
             </div>
             <!-- 月度进展信息 -->
             <div id="months">
-                <Months :action="action"></Months>
+                <Months :action="action" :xmId="projectId"></Months>
             </div>
             <!-- 企业入驻信息 -->
             <div id="companyenter">

src/views/manage-info/index.vue

@@ -46,7 +46,7 @@
             </div>
             <!-- 月度进展信息 -->
             <div id="months">
-                <Months :action="action"></Months>
+                <Months :action="action" :xmId=projectId></Months>
             </div>
             <!-- 企业入驻信息 -->
             <div id="companyenter">