feat:收款明细页面代码

src/api/business/financial/collectDetail.js

@@ -0,0 +1,41 @@
+import request from '@/utils/request'
+import { download } from '@/utils/request'
+import {blobValidate} from "@/utils/ruoyi";
+import errorCode from "@/utils/errorCode";
+import {ElMessage} from "element-plus";
+// 查询划款明细列表
+export function listCollection(query) {
+    request.defaults.baseURL = '/ezhizao-yzbh-financial'
+    return request({
+        url: '/business/collectionDetail/DetailList',
+        method: 'post',
+        data: query
+    })
+}
+
+export function exportCollection(query,filename) {
+    request.defaults.baseURL = '/ezhizao-yzbh-financial'
+    return request({
+        url: `/business/collectionDetail/export`,
+        method: 'post',
+        data: query,
+        responseType: 'blob',
+        timeout: 1000000
+    }).then(async (data) => {
+        const isLogin = await blobValidate(data);
+        if (isLogin) {
+            const blob = new Blob([data]);
+            saveAs(blob, filename);
+        } else {
+            const resText = await data.text();
+            const rspObj = JSON.parse(resText);
+            const errMsg =
+                errorCode[rspObj.code] || rspObj.msg || errorCode["default"];
+            ElMessage.error(errMsg);
+        }
+    })
+        .catch((r) => {
+            console.error(r);
+            ElMessage.error("下载文件出现错误，请联系管理员！");
+        });
+}

src/views/business/collect/detail/collectDetail.vue

@@ -0,0 +1,267 @@
+<template>
+  <div class="page-container list-container">
+    <div class="list-btns-container">
+      <el-button type="primary" size="small" icon="Download" @click="handleExport">导出</el-button>
+    </div>
+    <el-form ref="queryForm" class="list-search-container" :model="queryParams" :inline="true" label-width="68px">
+      <el-form-item label="客户名称：" prop="bizCollection.companyName">
+        <el-input v-model="queryParams.bizCollection.companyName" size="small" placeholder="请输入客户名称" style="width: 150px"
+                  clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+
+      <el-form-item label="合同编号：" prop="bizArchiveInput.contractNo">
+        <el-input v-model="queryParams.bizArchiveInput.contractNo" size="small" placeholder="请输入合同编号" style="width: 150px"
+                  clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item label="任务名称：" prop="taskTypeId">
+        <el-select size="small" v-model="queryParams.taskTypeId" placeholder="任务名称" clearable
+                   style="width: 150px">
+          <el-option v-for="item in taskTypeList " :key="item.id" :label="item.name" :value="item.id" />
+        </el-select>
+      </el-form-item>
+      <el-form-item  label="确认所属时间：" label-width="95px" prop="bizArchiveInput.map.receiptDateFilter">
+        <el-date-picker v-model="queryParams.bizArchiveInput.map.receiptDateFilter" size="small" type="daterange" clearable
+                        format="YYYY - MM - DD " value-format="YYYY-MM-DD" range-separator="至" start-placeholder="业务日期"
+                        end-placeholder="业务日期" style="width: 100%;"></el-date-picker>
+      </el-form-item>
+      <el-form-item label="甲方：" prop="bizArchiveInput.boss">
+        <el-input v-model="queryParams.bizArchiveInput.boss" size="small" placeholder="请输入甲方" style="width: 150px"
+                  clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item label="乙方：" prop="bizArchiveInput.party">
+        <el-input v-model="queryParams.bizArchiveInput.party" size="small" placeholder="请输入乙方" style="width: 150px"
+                  clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item label="申请人：" prop="bizCollection.applierName">
+        <el-input v-model="queryParams.bizCollection.applierName" size="small" placeholder="请输入申请人" style="width: 150px"
+                  clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+      <el-form-item label="审核人：" prop="bizCollection.verifyName">
+        <el-input v-model="queryParams.bizCollection.verifyName" size="small" placeholder="请输入审核人名称" style="width: 150px"
+                  clearable @keyup.enter="handleQuery" />
+      </el-form-item>
+
+
+      <div style="margin-top: 10px;" >
+        <el-form-item label="是否是项目：" prop="bizCollection.isProject" label-width="auto">
+          <el-select size="small" v-model="queryParams.bizCollection.isProject" placeholder="是否是项目" clearable
+                     style="width: 145px">
+            <el-option v-for="item in projectTypes" :key="item.value" :label="item.label"
+                       :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="新签/续签：" prop="bizArchiveInput.contractType">
+          <el-select size="small" v-model="queryParams.bizArchiveInput.contractType" placeholder="新签/续签" clearable
+                     style="width: 150px">
+            <el-option v-for="item in contractTypes" :key="item.value" :label="item.label"
+                       :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="项目名称：" prop="bizCollection.projectName">
+          <el-input v-model="queryParams.bizCollection.projectName" size="small" placeholder="请输入审核人名称" style="width: 150px"
+                    clearable @keyup.enter="handleQuery" />
+        </el-form-item>
+        <el-form-item label="项目主体名称：" prop="bizCollection.projectMainName">
+          <el-input v-model="queryParams.bizCollection.projectMainName" size="small" placeholder="请输入审核人名称" style="width: 150px"
+                    clearable @keyup.enter="handleQuery" />
+        </el-form-item>
+        <el-form-item label="请选择到账时间：" prop="bizArchiveInput.map.actuallyDateFilter">
+          <el-date-picker v-model="queryParams.bizArchiveInput.map.actuallyDateFilter" type="daterange" clearable size="small"
+                          format="YYYY - MM - DD " value-format="YYYY-MM-DD" range-separator="至" start-placeholder="业务日期"
+                          end-placeholder="业务日期" style="width: 100%;"></el-date-picker>
+        </el-form-item>
+
+        <el-form-item style="margin-left: 40px;">
+          <el-button type="primary" icon="Search" @click="handleQuery" size="small">搜索</el-button>
+          <el-button icon="Refresh" @click="resetQuery" size="small">重置</el-button>
+        </el-form-item>
+      </div>
+
+    </el-form>
+    <!-- 列表区 -->
+    <el-table v-loading="loading" :data="DataList" size="small" border height="100%">
+      <el-table-column type="index" width="55" align="center" />
+      <el-table-column label="客户名称" align="center" prop="bizCollection.companyName" >
+      </el-table-column>
+      <el-table-column label="合同编号" align="center" prop="bizArchiveInput.contractNo">
+      </el-table-column>
+      <el-table-column label="甲方" align="center" prop="bizArchiveInput.boss">
+      </el-table-column>
+      <el-table-column label="乙方" align="center" prop="bizArchiveInput.party">
+      </el-table-column>
+      <el-table-column label="任务名称" align="center" prop="taskTypeId">
+        <template #default="scope">
+            {{taskType[scope.row.taskTypeId]}}
+        </template>
+      </el-table-column>
+      <el-table-column label="任务金额" align="center" prop="bizArchiveInput.amount">
+      </el-table-column>
+      <el-table-column label="本次收款金额" align="center" prop="arriveAmount">
+      </el-table-column>
+      <el-table-column label="合同类型" align="center" prop="bizArchiveInput.contractType">
+        <template #default="scope">
+          {{scope.row.bizArchiveInput.contractType == null?'':scope.row.bizArchiveInput.contractType === 0?'新签':'续签'}}
+        </template>
+      </el-table-column>
+      <el-table-column label="是否是项目" align="center" prop="bizCollection.isProject">
+        <template #default="scope">
+          {{scope.row.bizCollection.isProject == null?'':scope.row.bizCollection.isProject === 0?'项目':'非项目'}}
+        </template>
+      </el-table-column>
+      <el-table-column label="确认所属时间" align="center" prop="bizCollection.actuallyDate">
+      </el-table-column>
+      <el-table-column label="已收款金额" align="center" prop="arrived">
+      </el-table-column>
+      <el-table-column label="收款账户" align="center" prop="bizCollection.subsidiaryName">
+      </el-table-column>
+      <el-table-column label="申请人" align="center" prop="bizCollection.applierName">
+      </el-table-column>
+      <el-table-column label="审核人" align="center" prop="bizCollection.verifyName" >
+      </el-table-column>
+      <el-table-column label="审核时间" align="center" prop="bizCollection.verifyDate" >
+      </el-table-column>
+      <el-table-column label="项目名称" align="center" prop="bizCollection.projectName" >
+      </el-table-column>
+      <el-table-column label="项目主体名称" align="center" prop="bizCollection.projectMainName" >
+      </el-table-column>
+      <el-table-column label="到账日期" align="center" prop="bizCollection.arriveDate" >
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <pagination v-show="total > 0" :total="total" v-model:page="queryParams.params.pageNum"
+                v-model:limit="queryParams.params.pageSize" @pagination="getList" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+
+import {ref} from "@vue/reactivity";
+import {defineComponent, getCurrentInstance, onActivated, onBeforeUpdate, reactive} from "vue";
+import { getToken, getTenant } from "@/utils/auth";
+import {
+  statistics, listTask, exportStatistics, getByContract
+} from "@/api/business/financial/collection";
+import {listCollection,exportCollection} from "@/api/business/financial/collectDetail"
+import {onMounted} from "@vue/runtime-core";
+import integer from "async-validator/dist-types/validator/integer";
+
+const { proxy } = getCurrentInstance();
+interface ICollectionDetail {
+  params:{
+    pageNum?: number;
+    pageSize?: number;
+  }
+  tenantId?: number;
+  id?:number;
+  bizCollection?:ICollection;
+  bizArchiveInput?:IArchive;
+  taskTypeName?:string;
+  taskTypeId?:string;
+  arriveAmount?:number;
+  arrived?:number;
+}
+interface IArchive{
+  Id?:number;
+  party?:string;
+  boss?:string;
+  amount?:number;
+  contractType?:string;
+  contractNo?:string;
+  map:{
+    receiptDateFilter?:Array<string>;
+    actuallyDateFilter?:Array<string>;
+  }
+  reqStatisticsVo?:any;
+}
+interface ICollection{
+  companyName?:string;
+  isProject?:number;
+  arriveDate?:Date;
+  actuallyDate?:Date;
+  subsidiaryName?:string;
+  applierName?:string;
+  verifyName?:string;
+  verifyDate?:Date;
+  projectName?:string;
+  projectMainName?:string;
+}
+const queryParams = ref<ICollectionDetail>({
+  tenantId:getTenant(),
+  bizArchiveInput:{
+    map:{}
+  },
+  bizCollection:{},
+  params:{
+    pageNum: 1,
+    pageSize: 20
+  }
+});
+const taskType = ref<Map<string, string>>();
+const projectTypes = ref([
+  {
+    label: "是",
+    value: 0,
+  },
+  {
+    label: "否",
+    value: 1,
+  },
+
+]);
+const contractTypes = ref([
+  {
+    label: "新签",
+    value: 0,
+  },
+  {
+    label: "续签",
+    value: 1,
+  },
+]);
+const loading = ref(true);
+const total = ref(0);
+const DataList = ref<ICollectionDetail[]>();
+const taskTypeList = ref();
+function listTasks() {
+  listTask().then((res:any) => {
+    taskTypeList.value = res as any[]
+    taskType.value = taskTypeList.value.reduce((pre, cur) => {
+      pre[cur.id] = cur.name;
+      return pre
+    }, {})
+  })
+}
+
+const getList = () => {
+  loading.value = true;
+  listCollection(queryParams.value).then((res:any) => {
+    DataList.value = res.rows;
+    total.value = res.total;
+    loading.value = false;
+  }).catch(e=>{
+    loading.value = false;
+  })
+}
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.params.pageNum = 1;
+  getList();
+}
+function resetQuery() {
+  proxy.$refs.queryForm.resetFields();
+  handleQuery();
+}
+const handleExport  = () =>{
+  exportCollection(queryParams.value,'收款明细导出.xlsx');
+}
+//组件激活时调用
+onMounted(() => {
+  // 你的逻辑
+  getList();
+  listTasks();
+});
+
+</script>
+<style scoped>
+
+</style>