收支分析

web/src/api/collection.js

@@ -33,3 +33,12 @@ export const deleteCollection = (data) => {
     data: data
   })
 }
+
+// 检索收款记录
+export const retrievalCollection = (data) => {
+  return service({
+    url: '/project/queryCollectionList',
+    method: 'POST',
+    data: data
+  })
+}

web/src/api/project.js

@@ -90,3 +90,12 @@ export const deleteProjectState = (data) => {
     data: data
   })
 }
+
+// 查询项目的收支分析
+export const queryProjectExpense = (code) => {
+  return service({
+    url: '/finance/queryProjectFinance',
+    method: 'GET',
+    params: { code: code }
+  })
+}

web/src/pinia/collection/Collection.js

@@ -1,11 +1,12 @@
 import { defineStore } from 'pinia'
-import { reactive } from 'vue'
+import { reactive, ref } from 'vue'
 import { createCollection, deleteCollection, queryCollection, updateCollection } from '@/api/collection'
 import { formatDate } from '@/utils/formatDate'
 
 export const collectionOperate = defineStore('payment', () => {
   // 定义数据
   const paymentList = reactive([])
+  const paymentCode = ref('')
   // 定义修改数据的方法
   const getPaymentList = (code) => {
     queryCollection(code).then(res => {
@@ -16,6 +17,7 @@ export const collectionOperate = defineStore('payment', () => {
         })
         paymentList.length = 0
         paymentList.push(...data)
+        console.log(paymentList)
       }
     })
   }
@@ -40,11 +42,25 @@ export const collectionOperate = defineStore('payment', () => {
       }
     })
   }
+  const changePaymentList = (list) => {
+    list.forEach(item => {
+      item.collectionTime = formatDate(item.collectionTime)
+    })
+    paymentList.length = 0
+    paymentList.push(...list)
+  }
+  const changePaymentCode = (code) => {
+    paymentCode.value = code
+  }
+
   return {
     paymentList,
+    paymentCode,
     getPaymentList,
     postCollection,
     putCollection,
-    delCollection
+    delCollection,
+    changePaymentList,
+    changePaymentCode
   }
 })

web/src/pinia/hour/Hour.js

@@ -35,11 +35,16 @@ export const hourOperate = defineStore('time', () => {
       }
     })
   }
+  const changeTimeList = (list) => {
+    timeList.length = 0
+    timeList.push(...list)
+  }
   return {
     timeList,
     getTimeList,
     postTime,
     putTime,
-    delTime
+    delTime,
+    changeTimeList
   }
 })

web/src/pinia/reimbursement/Reimbursement.js

@@ -36,11 +36,16 @@ export const reimburseOperate = defineStore('account', () => {
       }
     })
   }
+  const changeReimburseList = (list) => {
+    reimburseList.length = 0
+    reimburseList.push(...list)
+  }
   return {
     reimburseList,
     getReimburseList,
     postReimburse,
     putReimburse,
-    delReimburse
+    delReimburse,
+    changeReimburseList
   }
 })

web/src/view/finance/components/hour.vue

@@ -1,22 +1,18 @@
 <template>
   <div>
-      <el-row>
-        <el-col :span="6">
-          <el-form-item
-              label="人员名称："
-          >
-            <el-input
-                v-model="condition.name"
-                placeholder="请输入人员名称"
-            />
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-table>
-          <el-table-column/>
-        </el-table>
-      </el-row>
+    <el-row>
+      <el-col :span="6">
+        <el-form-item
+          label="人员名称："
+        >
+          <el-input
+            v-model="condition.name"
+            placeholder="请输入人员名称"
+          />
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row/>
   </div>
 </template>
 

web/src/view/finance/components/payment.vue

@@ -6,11 +6,11 @@
           label="收款日期："
         >
           <el-date-picker
-            v-model="paymentTime"
-            type="date"
-            placeholder="请选择收款日期"
-            format="YYYY-MM-DD"
-            value-format="YYYY-MM-DD"
+            v-model="condition.time"
+            type="month"
+            placeholder="请选择收款月份"
+            format="YYYY-MM"
+            value-format="YYYY-MM"
           />
         </el-form-item>
       </el-col>
@@ -18,36 +18,191 @@
         <el-button
           type="primary"
           :icon="Search"
+          @click="searchCollection"
         >查询</el-button>
       </el-col>
     </el-row>
     <el-row>
-      <el-col :span="12">
-        <el-table v-model="pay.paymentList">
+      <el-col :span="14">
+        <el-table
+          :data="pay.paymentList"
+          stripe
+        >
           <el-table-column
             label="收款时间"
             prop="collectionTime"
+            align="center"
+            width="180px"
           />
           <el-table-column
-            label="收款金额"
+            label="收款金额（元）"
             prop="price"
+            align="center"
+            width="250px"
           />
+          <el-table-column
+            label="操作"
+            align="center"
+          >
+            <template #default="scope">
+              <el-popover
+                placement="top-start"
+                title="收款备注"
+                :width="200"
+                trigger="click"
+                :content="scope.remarks"
+              >
+                <template #reference>
+                  <el-button
+                    text
+                    type="primary"
+                    :icon="Notebook"
+                    size="large"
+                  >
+                    备注
+                  </el-button>
+                </template>
+              </el-popover>
+              <el-button
+                text
+                type="primary"
+                :icon="Edit"
+                size="large"
+                @click="openPaymentEdit(scope.row)"
+              >
+                编辑
+              </el-button>
+              <el-button
+                text
+                type="primary"
+                :icon="Delete"
+                size="large"
+                @click="paymentDelete(scope.row)"
+              >
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
         </el-table>
       </el-col>
     </el-row>
+    <el-dialog
+      v-model="paymentEditShow"
+      title="收款编辑"
+      width="40%"
+    >
+      <el-form>
+        <el-form-item
+          label="收款金额："
+          size="large"
+        >
+          <el-input
+            v-model="paymentEditData.days"
+            placeholder="请输入收款金额"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item
+          label="收款日期："
+          size="large"
+        >
+          <el-date-picker
+            v-model="paymentEditData.collectionTime"
+            type="date"
+            placeholder="请选择收款日期"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item
+          label="收款备注："
+          size="large"
+        >
+          <el-input
+            v-model="paymentEditData.remarks"
+            placeholder="请输入收款备注"
+            clearable
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button
+          type="primary"
+          @click="paymentEdit"
+        >
+          确认
+        </el-button>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
-import { Search } from '@element-plus/icons-vue'
+import { reactive, ref } from 'vue'
+import { Search, Delete, Edit, Notebook } from '@element-plus/icons-vue'
+import { retrievalCollection, updateCollection } from '@/api/collection'
 import { collectionOperate } from '@/pinia/collection/Collection'
+import { ElMessage, ElMessageBox } from 'element-plus'
 defineOptions({
   name: 'Payment'
 })
-const paymentTime = ref('')
 const pay = collectionOperate()
-console.log(pay.paymentList)
+// 数据
+const condition = reactive({
+  pageInfo: {
+    page: 1,
+    pageSize: 10
+  },
+  code: '',
+  time: ''
+})
+
+const paymentEditShow = ref(false)
+const paymentEditData = reactive({
+  id: 0,
+  projectCode: '',
+  days: 0,
+  remarks: '',
+  collectionTime: ''
+})
+// 方法
+const openPaymentEdit = (row) => {
+  console.log(row)
+  paymentEditShow.value = true
+  paymentEditData.projectCode = row.projectCode
+  paymentEditData.collectionTime = row.collectionTime
+  paymentEditData.days = row.price
+  paymentEditData.id = row.ID
+}
+
+const paymentEdit = () => {
+  updateCollection(paymentEditData).then(res => {
+    if (res.code === 0) {
+      ElMessage({
+        message: '编辑成功',
+        type: 'success',
+        showClose: true,
+        duration: 2000
+      })
+    }
+  })
+  paymentEditShow.value = false
+}
+const paymentDelete = (row) => {
+  console.log(row)
+}
+
+const searchCollection = () => {
+  condition.code = pay.paymentCode
+  console.log(condition)
+  retrievalCollection(condition).then(res => {
+    console.log(res.data)
+    if (res.code === 0) {
+      pay.changePaymentList(res.data.list)
+    }
+  })
+}
 
 </script>
 

web/src/view/finance/financeAnalysis/financeAnalysis.vue

@@ -157,29 +157,32 @@
     </el-row>
     <el-row
       class="bg-white mt-5"
-      style="height: 510px"
+      style="height: 540px"
     >
-      <el-col :span="20" class="ml-10">
+      <el-col
+        :span="20"
+        class="ml-10"
+      >
         <el-tabs
-            v-model="listSort"
-            class="demo-tabs"
-            @tab-click="changeSort"
+          v-model="listSort"
+          class="demo-tabs"
+          @tab-click="changeSort"
         >
           <el-tab-pane
-              label="实施工时"
-              :name="1"
+            label="实施工时"
+            :name="1"
           >
-            <Hour/>
+            <Hour />
           </el-tab-pane>
           <el-tab-pane
-              label="费用报销"
-              :name="2"
+            label="费用报销"
+            :name="2"
           >Config</el-tab-pane>
           <el-tab-pane
-              label="项目收款"
-              :name="3"
+            label="项目收款"
+            :name="3"
           >
-            <payment/>
+            <payment />
           </el-tab-pane>
         </el-tabs>
       </el-col>
@@ -254,7 +257,7 @@
 <script setup>
 import { Menu, Search } from '@element-plus/icons-vue'
 import { ref, onMounted, reactive, computed } from 'vue'
-import { getProjectList, getProjectMessage } from '@/api/project'
+import { getProjectList, getProjectMessage, queryProjectExpense } from '@/api/project'
 import { collectionOperate } from '@/pinia/collection/Collection'
 import iconCollection from '@/assets/Collection.png'
 import iconAmount from '@/assets/amount.png'
@@ -315,8 +318,13 @@ const projectList = (condition) => {
       const list = res.data.list
       projectTotal.value = res.data.total
       listData.push(...list)
-      payment.getPaymentList(list[0].code)
       hour.getTimeList(list[0].code)
+      payment.changePaymentCode(list[0].code)
+      queryProjectExpense(list[0].code).then(res => {
+        if (res.code === 0) {
+          payment.changePaymentList(res.data.collection)
+        }
+      })
       getProjectMessage(list[0].code).then(res => {
         if (res.code === 0) {
           Object.assign(projectMessage, res.data)