|
|
@@ -1,13 +1,21 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <block v-if="!$util.isEmpty(list.data)">
|
|
|
+ <app-tabs
|
|
|
+ :tabs="tabs"
|
|
|
+ :isFixed="true"
|
|
|
+ :currentTab="tabIndex"
|
|
|
+ :height="100"
|
|
|
+ @change="changeIncome"
|
|
|
+ itemWidth="50%"
|
|
|
+ />
|
|
|
+ <div class="list-by_box" v-if="!$util.isEmpty(list.data)">
|
|
|
<t-table :headerBackgroundColor="'#F0F2F6'">
|
|
|
<t-tr header>
|
|
|
<t-th v-for="(item, index) in columns" :key="index" :align="item.align">
|
|
|
{{ item.name }}
|
|
|
</t-th>
|
|
|
</t-tr>
|
|
|
- <t-tr v-for="(item, index) in list" :key="index">
|
|
|
+ <t-tr v-for="(item, index) in list.data" :key="index">
|
|
|
<t-td
|
|
|
v-for="(column, colIndex) in columns"
|
|
|
:key="colIndex"
|
|
|
@@ -20,7 +28,7 @@
|
|
|
</t-td>
|
|
|
</t-tr>
|
|
|
</t-table>
|
|
|
- </block>
|
|
|
+ </div>
|
|
|
<block v-else>
|
|
|
<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
|
|
|
</block>
|
|
|
@@ -29,29 +37,34 @@
|
|
|
|
|
|
<script>
|
|
|
import AppWrapperEmpty from "@/components/app-wrapper-empty";
|
|
|
+import AppTabs from "@/components/plugin/tabs";
|
|
|
+import { list } from "@/mixins";
|
|
|
+import { capitaList } from '@/api/store'
|
|
|
export default {
|
|
|
name: "IncomeExpenses", //收支记录
|
|
|
components: {
|
|
|
- AppWrapperEmpty
|
|
|
+ AppWrapperEmpty,
|
|
|
+ AppTabs
|
|
|
},
|
|
|
+ mixins: [list],
|
|
|
data() {
|
|
|
return {
|
|
|
columns: [
|
|
|
{
|
|
|
name: "事项",
|
|
|
- dataIndex: "typeName",
|
|
|
+ dataIndex: "event",
|
|
|
color: "info",
|
|
|
align: "center"
|
|
|
},
|
|
|
{
|
|
|
name: "收支金额",
|
|
|
- dataIndex: "typeName",
|
|
|
+ dataIndex: "amount",
|
|
|
color: "info",
|
|
|
align: "center"
|
|
|
},
|
|
|
{
|
|
|
name: "余额",
|
|
|
- dataIndex: "typeName",
|
|
|
+ dataIndex: "balance",
|
|
|
color: "info",
|
|
|
align: "center"
|
|
|
},
|
|
|
@@ -62,14 +75,66 @@ export default {
|
|
|
align: "center"
|
|
|
}
|
|
|
],
|
|
|
- list: [{ time: "1221", typeName: "hahah", stock: "121255" }]
|
|
|
+ // list: [{ time: "1221", typeName: "hahah", stock: "121255" }],
|
|
|
+ tabIndex: 0,
|
|
|
+ tabs: [
|
|
|
+ {
|
|
|
+ name: "收入",
|
|
|
+ key:1
|
|
|
+ // value: 1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "支出",
|
|
|
+ key:0
|
|
|
+ // value: 0
|
|
|
+ }
|
|
|
+ ]
|
|
|
};
|
|
|
},
|
|
|
- methods: {},
|
|
|
- onPullDownRefresh() {
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ this._list();
|
|
|
+ },
|
|
|
+ changeIncome(e){
|
|
|
+ if (this.tabIndex == e.index) {
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ this.tabIndex = e.index;
|
|
|
+ this.resetList();
|
|
|
+ this._list();
|
|
|
+ }
|
|
|
|
|
|
- }
|
|
|
+
|
|
|
+ },
|
|
|
+ _list(){
|
|
|
+ return capitaList({
|
|
|
+ page: this.list.page,
|
|
|
+ io: this.tabs[this.tabIndex].key
|
|
|
+ }).then(res=>{
|
|
|
+ this.completes(res);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ this.resetList();
|
|
|
+ this._list().then(res => {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ if (!this.list.finished) {
|
|
|
+ this._list().then(res => {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ }
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss" scoped></style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .list-by_box {
|
|
|
+ padding-top: 100px;
|
|
|
+ }
|
|
|
+</style>
|