项目文件管理完成

src/api/firmCost.js

@@ -25,3 +25,18 @@ export const peopleCost = (data) => {
         data: data
     })
 }
+
+// 查询部门费用
+export const queryMonthExpenses = (parms) => {
+    return service({
+        url: '/expenses/queryMonthExpenses',
+        params: parms,
+        method: 'get',
+    })
+}
+// export const queryMonthExpenses = (month, year, genre) => {
+//     return service({
+//         url: '/expenses/queryMonthExpenses?monthTime=' + month + '&yearTime=' + year + '&genre=' + genre,
+//         method: 'get',
+//     })
+// }

src/view/finance/components/departmentCost.vue

@@ -1,11 +1,185 @@
+<template>
+  <van-row style="margin-top: 20px" @click="dateScreenShow = true">
+    <van-col :span="24">
+      <van-cell-group>
+        <van-cell
+            size="large"
+            class="checkCell"
+            title-class="projectTitle"
+            title="筛选条件："
+        >
+          <template #value>
+            <van-row justify="end">
+              <van-col class="resetCostCell" @click.stop="resetCost">
+                <van-icon name="replay" />
+                <van-text-ellipsis content="重置" />
+              </van-col>
+            </van-row>
+          </template>
+        </van-cell>
+      </van-cell-group>
+    </van-col>
+  </van-row>
+  <van-collapse
+      v-model="activeNames"
+      v-for="(item,index) in costList"
+      :key="item.departmentId"
+      class="collapseBox"
+  >
+    <van-collapse-item
+        :title="item.department.name"
+        :name="index"
+        class="collapseItem"
+    >
+      <van-row>
+        <van-col :span="12">
+          <van-text-ellipsis :content="depositAmount(item.totalDeposit)"/>
+        </van-col>
+        <van-col :span="12">
+          <van-text-ellipsis :content="expenditureAmount(item.totalExpenditure)"/>
+        </van-col>
+      </van-row>
+    </van-collapse-item>
+  </van-collapse>
+  <van-popup
+      v-model:show="dateScreenShow"
+      position="bottom"
+      class="popupBox"
+      closeable
+      close-icon-position="top-right"
+  >
+    <van-row class="popupRow">
+      <van-col :span="22" :offset="1">
+        <el-form label-width="90" label-position="left">
+          <el-form-item
+              label="月份:"
+              size="large"
+          >
+            <el-date-picker
+                v-model="condition.monthTime"
+                type="month"
+                placeholder="请选择月份"
+                format="YYYY-MM"
+                value-format="YYYY-MM"
+                clearable
+                @clear="condition.monthTime = ''"
+            />
+          </el-form-item>
+          <el-form-item
+              label="年份:"
+              size="large"
+          >
+            <el-date-picker
+                v-model="condition.yearTime"
+                type="year"
+                placeholder="请选择年份"
+                format="YYYY"
+                value-format="YYYY"
+                clearable
+                @clear="condition.yearTime = ''"
+            />
+          </el-form-item>
+          <el-form-item
+              label="类型:"
+              size="large"
+          >
+            <el-select
+                v-model="condition.genre"
+                placeholder="请选择费用类型"
+                clearable
+                @clear="condition.genre = 0"
+            >
+              <el-option
+                  v-for="item in useFinance.costTypeList"
+                  :key="item.ID"
+                  :label="item.name"
+                  :value="item.ID"
+              />
+            </el-select>
+          </el-form-item>
+        </el-form>
+        <van-row class="popupCheck">
+          <van-col :span="24">
+            <van-button type="primary" @click="getMonthExpenses" size="large">查询</van-button>
+          </van-col>
+        </van-row>
+      </van-col>
+    </van-row>
+  </van-popup>
+</template>
+
 <script setup>
+import { queryMonthExpenses } from "@/api/firmCost"
+import { useFinanceStore } from "@/pinia/finance/finance";
+defineOptions({
+  name: 'departmentCost',
+})
+const useFinance = useFinanceStore()
+const condition = reactive({
+  monthTime: "",
+  yearTime: "",
+  genre: ""
+})
+onMounted(() => {
+  getMonthExpenses()
+})
+// 检索费用
+const dateScreenShow = ref(false)
+// 费用列表
+const costList = reactive([])
+const getMonthExpenses = () => {
+  queryMonthExpenses(condition).then(res => {
+    if (res.code === 0) {
+      costList.length = 0
+      costList.push(...res.data)
+      dateScreenShow.value = false
+    }
+  })
+}
+const activeNames = ref(['1'])
+const resetCost = () => {
+  const info = {
+    monthTime: "",
+    yearTime: "",
+    genre: ""
+  }
+  Object.assign(condition, info)
+  getMonthExpenses()
+}
 
+// 计算属性
+const depositAmount = computed(() => {
+  return (amount) => "支入：" + amount
+})
+const expenditureAmount = computed(() => {
+  return (amount) => "支出：" + amount
+})
 </script>
 
-<template>
-  部门费用
-</template>
+<style scoped lang="less">
+.checkCell{
+  height: 45px;
+  font-size: 16px;
+  .projectTitle{
+    width: 200px;
+  }
+  .resetCostCell {
+    display: flex;
+    align-items: center;
+  }
+}
 
-<style scoped>
+.popupBox{
+  height: 500px;
+  .popupRow{
+    margin-top: 50px;
+  }
+  .popupCheck{
+    margin-top: 50px;
+  }
+}
 
+.collapseItem{
+  margin-top: 20px;
+}
 </style>

src/view/finance/components/staffCost.vue

@@ -18,25 +18,34 @@
       </van-cell-group>
     </van-col>
   </van-row>
-  <van-list
-      v-model:loading="loading"
-      :finished="finished"
-      :offset="20"
-      finished-text="没有更多了"
-      @load="onLoad"
+  <van-collapse
+      v-model="activeNames"
+      v-for="(item,index) in staffCostList"
+      :key="index + 'a'"
+      class="collapseBox"
   >
-    <van-collapse v-model="activeNames" class="collapseBox">
-      <van-collapse-item title="标题1" name="1">
-        代码是写出来给人看的，附带能在机器上运行。
-      </van-collapse-item>
-      <van-collapse-item title="标题2" name="2">
-        技术无非就是那些开发它的人的共同灵魂。
-      </van-collapse-item>
-      <van-collapse-item title="标题3" name="3">
-        在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。
-      </van-collapse-item>
-    </van-collapse>
-  </van-list>
+    <van-collapse-item
+        :title="item.user.nickName"
+        :value="item.department.name"
+        :name="index + 'a'"
+    >
+      <van-row>
+        <van-col :span="12">
+          <van-text-ellipsis :content="depositAmount(item.DepositAmountSum)"/>
+        </van-col>
+        <van-col :span="12">
+          <van-text-ellipsis :content="expenditureAmount(item.ExpenditureAmountSum)"/>
+        </van-col>
+      </van-row>
+    </van-collapse-item>
+  </van-collapse>
+  <van-pagination
+      class="pagination"
+      v-model="condition.pageInfo.page"
+      :total-items="totalItems"
+      :items-per-page="10"
+      @change="changePage"
+  />
   <van-popup
       v-model:show="dateScreenShow"
       position="bottom"
@@ -46,7 +55,7 @@
   >
     <van-row class="popupRow">
       <van-col :span="22" :offset="1">
-        <el-form label-width="90" label-position="left">
+        <el-form label-width="100" label-position="left">
           <el-form-item label="时间类型：" size="large">
             <el-select
                 placeholder="请选择日期选择器类型"
@@ -160,7 +169,22 @@ defineOptions({
   name: 'costDetail',
 })
 const dateScreenShow = ref(false)
-const resetStaffCost = () => {}
+const resetStaffCost = () => {
+  const info = {
+    pageInfo: {
+      page: 1,
+      pageSize: 10
+    },
+    reimburser: 0,
+    projectId: 0,
+    genre: 0,
+    dayTime: '',
+    monthTime: '',
+    yearTime: ''
+  }
+  Object.assign(condition, info)
+  getStaffCostList()
+}
 
 // 时间类型
 const timeType = ref('day')
@@ -195,57 +219,40 @@ const condition = reactive({
   monthTime: '',
   yearTime: ''
 })
-
 onMounted(() => {
   getStaffCostList()
 })
 // 查询人员费用
-const staffCostPage = ref(0)
 const staffCostList = reactive([])
 const getStaffCostList = () => {
   peopleCost(condition).then(res => {
     if (res.code === 0) {
       const list = res.data.list
-      const total = res.data.total
-      console.log(total)
-      const divisor = Math.floor(total / 10)
-      const remainder = total % 10
-      console.log("整数：", divisor)
-      console.log("余数：",remainder)
-      staffCostPage.value = remainder > 0 ? divisor + 1 : divisor
-      console.log("staffCostPage", staffCostPage.value)
-      console.log("page",condition.pageInfo.page)
-      // finished.value = staffCostPage.value === condition.pageInfo.page
-      // console.log("初次确认", finished.value)
-      // staffCostList.length = 0
-      // staffCostList.push(...list)
-      // dateScreenShow.value = false
+      totalItems.value = res.data.total
+      staffCostList.length = 0
+      staffCostList.push(...list)
+      dateScreenShow.value = false
     }
   })
 }
-
 // 人员费用列表
 const activeNames = ref(['1'])
-// 上拉加载
-const loading = ref(false);
-const finished = ref(false);
-const onLoad = () => {
-  setTimeout(() => {
-    loading.value = true
-    condition.pageInfo.page += 1
-    peopleCost(condition).then(res => {
-      console.log('res',res)
-      if (res.code === 0) {
-        const list = res.data.list
-        if (list !== null) {
-          staffCostList.push(...list)
-          finished.value = staffCostPage.value === condition.pageInfo.page
-        }
-        loading.value = false
-      }
-    })
-  },500)
+// 分页
+const currentPage = ref(1)
+const totalItems = ref(0)
+const changePage = (val) => {
+  condition.pageInfo.page = val
+  getStaffCostList()
 }
+
+// 计算属性
+const depositAmount = computed(() => {
+  return (amount) => "支入：" + amount
+})
+const expenditureAmount = computed(() => {
+  return (amount) => "支出：" + amount
+})
+
 </script>
 
 <style scoped lang="less">
@@ -274,4 +281,8 @@ const onLoad = () => {
 .collapseBox{
   margin-top: 20px;
 }
+
+.pagination{
+  margin: 30px 0 30px 0;
+}
 </style>

src/view/finance/finance.vue

@@ -34,6 +34,5 @@ const changeDropdown = (val) => {
 }
 </script>
 
-<style scoped>
-
+<style scoped lang="less">
 </style>

src/view/navigation/navigation.vue

@@ -52,12 +52,12 @@ const navigatorJump = (mine) => {
 </script>
 
 <template>
-  <van-nav-bar left-text="返回" left-arrow>
+  <van-nav-bar left-text="返回" left-arrow class="mainInterface">
     <template #title>
       <span style="font-weight: 500">{{pageTitle}}</span>
     </template>
     <template #right>
-      <van-icon name="bars" size="28px" @click="openNavigation"/>
+      <van-icon name="bars" size="35px" @click="openNavigation" class="jumpIcon"/>
     </template>
   </van-nav-bar>
   <router-view/>
@@ -71,8 +71,5 @@ const navigatorJump = (mine) => {
 </template>
 
 <style scoped lang="scss">
-.topNavigation {
-  height: 7vh;
-  border-bottom: 1px solid #000000;
-}
+
 </style>