1

jy-ui/src/api/business/contract/info.ts

@@ -30,3 +30,8 @@ export function deleteApi(data: StrAnyObj): Promise<void> {
 export function getStatistics(params: StrAnyObj): Promise<void> {
   return request.get('/contractInfo/statistics', params)
 }
+
+// 统计数据
+export function getTransactionList(params: StrAnyObj): Promise<void> {
+  return request.get('/contractInfo/getTransactionList', params)
+}

jy-ui/src/views/business/contract/info/detail.vue

@@ -1,5 +1,5 @@
 <template>
-  <div style="max-height: calc(100vh - 190px); overflow: hidden auto">
+  <div style="max-height: calc(100vh - 200px); overflow: hidden auto">
     <div style="text-align: center; font-size: 20px; color: #409eff; font-weight: bold">
       CONTRACT
     </div>
@@ -156,7 +156,6 @@ import { getDetailApi } from '@/api/business/contract/info'
 const { proxy } = getCurrentInstance()
 const props = defineProps({
   rowData: Object,
-  detailData: Object
 })
 const formData = reactive({
   data: {

jy-ui/src/views/business/contract/info/index.vue

@@ -14,6 +14,7 @@ import {
   getStatistics
 } from '@/api/business/contract/info'
 import Detail from './detail.vue'
+import TransactionDetail from './transaction-detail.vue'
 
 const queryRef = ref<InstanceType<typeof AForm>>()
 const formRef = ref<InstanceType<typeof AForm>>()
@@ -21,6 +22,7 @@ const formRef = ref<InstanceType<typeof AForm>>()
 const showQuery = ref<boolean>(true)
 const selectKeys = ref<string[]>([])
 const pageTotal = ref<number>(0)
+const activeName = ref<string>('1')
 
 const queryData = ref<StrAnyObj>({ pageNum: 1, pageSize: 10 })
 const tableData = ref<StrAnyObjArr>([])
@@ -122,6 +124,7 @@ const columnConfig: ColumnConfigType[] = [
         click(row) {
           formData.value = row
           dialogVisible.value = true
+          activeName.value = '1'
           dialogTitle.value = '详情'
         }
       }
@@ -539,10 +542,17 @@ function handleRemove(idList: string[]) {
       :title="dialogTitle"
       @submit="formSubmit"
       @closed="formClosed"
-      style="width: 900px"
+      style="width: 1100px"
       :footer="false"
     >
-      <Detail :rowData="formData"></Detail>
+      <el-tabs v-model="activeName" type="card">
+        <el-tab-pane label="合同详情" name="1">
+          <Detail :rowData="formData"></Detail>
+        </el-tab-pane>
+        <el-tab-pane label="交易明细" name="2">
+          <TransactionDetail :rowData="formData"></TransactionDetail>
+        </el-tab-pane>
+      </el-tabs>
     </a-dialog>
   </div>
 </template>

jy-ui/src/views/business/contract/info/transaction-detail.vue

@@ -0,0 +1,46 @@
+<template>
+  <div style="max-height: calc(100vh - 200px); overflow: hidden auto">
+    <el-table :data="formData.data.items" style="width: 100%">
+      <el-table-column label="交易时间" prop="tradingTime" width="110" />
+      <el-table-column label="交易类型" width="110">
+        <template v-slot="scope">
+          <el-tag v-if="scope.row.type === 1" type="success">请款</el-tag>
+          <el-tag v-else-if="scope.row.type === 2" type="warning">到账认领</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="交易金额" prop="tradingAmount" width="110" />
+      <el-table-column label="摘要" prop="remark" />
+      <el-table-column label="资金账户">
+        <template v-slot="scope">
+          <div>{{ scope.row.accountName }} ({{ scope.row.depositBank }})</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="对方账户">
+        <template v-slot="scope">
+          <div>{{ scope.row.targetAccountName }} ({{ scope.row.targetAccount }})</div>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script setup>
+import { getTransactionList } from '@/api/business/contract/info'
+
+const { proxy } = getCurrentInstance()
+const props = defineProps({
+  rowData: Object
+})
+const formData = reactive({
+  data: {
+    items: []
+  }
+})
+onMounted(() => {
+  getTransactionList({ id: props.rowData.id }).then((res) => {
+    formData.data.items = res
+  })
+})
+</script>
+
+<style lang="scss" scoped></style>