收支分析

web/src/api/collection.js

@@ -0,0 +1,29 @@
+import service from '@/utils/request'
+// 查询收款记录
+export const queryCollection = () => {
+  return service({
+    url: '/project/queryCollection',
+    method: 'get'
+  })
+}
+// 新增收款记录
+export const createCollection = () => {
+  return service({
+    url: '/project/createCollection',
+    method: 'post'
+  })
+}
+// 修改收款记录
+export const updateCollection = () => {
+  return service({
+    url: '/project/updateCollection',
+    method: 'put'
+  })
+}
+// 删除收款记录
+export const deleteCollection = () => {
+  return service({
+    url: '/project/deleteCollection',
+    method: 'delete'
+  })
+}

web/src/api/hour.js

@@ -0,0 +1,13 @@
+import service from '@/utils/request'
+
+// 查询工时
+export const queryHour = () => {
+  return service({
+    url: '/project/queryCollection',
+    method: 'get'
+  })
+}
+// 新增工时
+// 修改工时
+// 删除工时
+

web/src/api/project.js

@@ -5,9 +5,6 @@ export const getProjectList = (data) => {
     url: '/project/queryProjectList',
     method: 'post',
     data: data
-    // headers: {
-    //   'Authorization': localStorage.getItem('token')
-    // }
   })
 }
 

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

@@ -0,0 +1,160 @@
+<template>
+  <div>
+    <el-row
+      class="bg-white"
+      style="height: 60px"
+      align="middle"
+    >
+      <el-col :span="22" />
+      <el-col :span="2">
+        <el-button
+          text
+          :icon="Menu"
+          size="large"
+          @click="listShow = true"
+        >
+          项目列表
+        </el-button>
+      </el-col>
+    </el-row>
+    <el-row
+      class="bg-white mt-5"
+      style="height: 150px"
+    />
+    <el-row
+      class="bg-white mt-5"
+      style="height: 550px"
+    />
+    <el-drawer
+      v-model="listShow"
+      direction="ltr"
+      title="项目列表"
+      size="25%"
+    >
+      <el-form @submit.prevent>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item>
+              <el-input
+                v-model="condition.name"
+                :suffix-icon="Search"
+                placeholder="请输入项目名称"
+                size="large"
+                clearable
+                @keyup.enter="nameSearch"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row
+          v-for="item in listData"
+          :key="item.ID"
+          style="height: 80px"
+          align="middle"
+        >
+          <el-col :span="17">
+            <el-row style="height: 45px">
+              <el-text
+                size="large"
+                :line-clamp="1"
+                tag="b"
+              >{{ item.name }}</el-text>
+            </el-row>
+            <el-row style="height: 35px">
+              <el-text :line-clamp="1">
+                负责人：{{ item.principal }}
+              </el-text>
+            </el-row>
+          </el-col>
+          <el-col
+            :span="7"
+            class="flex justify-center"
+          >
+            <el-button
+              :type="buttonType(item.state)"
+              round
+              size="large"
+              @click="incomeExpenses(item.code)"
+            >收支信息</el-button>
+          </el-col>
+        </el-row>
+      </el-form>
+      <el-pagination
+        v-show="projectTotal > 8"
+        background
+        layout="prev, pager, next"
+        :total="projectTotal"
+        :page-size="8"
+        v-model:current-page="condition.pageInfo.page"
+        @change="changePage"
+      />
+    </el-drawer>
+  </div>
+</template>
+
+<script setup>
+import { Menu, Search } from '@element-plus/icons-vue'
+import { ref, onMounted, reactive, computed } from 'vue'
+import { getProjectList } from '@/api/project'
+defineOptions({
+  name: 'FinanceAnalysis'
+})
+// 数据
+const listShow = ref(false)
+const condition = reactive({
+  pageInfo: {
+    page: 1,
+    pageSize: 8
+  },
+  name: '',
+  time: '',
+  state: 0
+})
+const listData = reactive([])
+const projectTotal = ref(0)
+// 计算属性
+const buttonType = computed(() => (state) => {
+  const obj = {
+    1: 'info',
+    2: 'warning',
+    3: 'primary',
+    4: 'success',
+    5: 'danger',
+  }
+  return obj[state]
+})
+// 方法
+onMounted(() => {
+  projectList(condition)
+})
+const projectList = (condition) => {
+  listData.length = 0
+  getProjectList(condition).then(res => {
+    if (res.code === 0) {
+      // projectTotal.value = 10
+      projectTotal.value = res.data.total
+      listData.push(...res.data.list)
+      console.log(res.data.list)
+    }
+  })
+}
+const nameSearch = () => {
+  condition.pageInfo.page = 1
+  console.log(condition)
+  projectList(condition)
+}
+const changePage = (page) => {
+  const search = condition
+  search.pageInfo.page = page
+  console.log(search)
+  projectList(search)
+}
+
+const incomeExpenses = (code) => {
+
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

web/src/view/finance/financialAnalysis/financialAnalysis.vue

@@ -1,15 +0,0 @@
-<template>
-  <div>
-    <div>收支分析</div>
-  </div>
-</template>
-
-<script setup>
-defineOptions({
-  name: 'financialAnalysis'
-})
-</script>
-
-<style scoped>
-
-</style>