Blame view

src/components/fee/feeDetailImport.vue 3.33 KB
f80ea09a   wuxw   加入费用详情
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
  <template>
    <div>
      <div class="margin-top">
        <el-table
          :data="feeDetailImportInfo.importFeeDetails"
          border
          style="width: 100%"
        >
          <el-table-column
            prop="floorNum"
            :label="$t('feeDetailImport.floorNum')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="unitNum"
            :label="$t('feeDetailImport.unitNum')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="roomNum"
            :label="$t('feeDetailImport.roomNum')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="feeName"
            :label="$t('feeDetailImport.feeName')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="startTime"
            :label="$t('feeDetailImport.startTime')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="endTime"
            :label="$t('feeDetailImport.endTime')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="amount"
            :label="$t('feeDetailImport.totalAmount')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="remark"
            :label="$t('feeDetailImport.remark')"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="state"
            :label="$t('feeDetailImport.status')"
            align="center"
          >
            <template #default="{row}">
              <el-tag :type="row.state === '1000' ? 'success' : 'danger'">
                {{row.state === '1000' ? $t('feeDetailImport.importSuccess') : $t('feeDetailImport.importFailed')}}
              </el-tag>
            </template>
          </el-table-column>
        </el-table>
  
        <el-row class="margin-top">
          <el-col :span="4"></el-col>
          <el-col :span="20">
            <el-pagination
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-size="pageSize"
              layout="total, prev, pager, next, jumper"
              :total="total"
            ></el-pagination>
          </el-col>
        </el-row>
      </div>
    </div>
  </template>
  
  <script>
  import { queryImportFeeDetail } from '@/api/fee/feeDetailImportApi'
0b0e0aab   wuxw   费用详情页面开发完成
80
  import { getCommunityId } from '@/api/community/communityApi' 
f80ea09a   wuxw   加入费用详情
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
  
  export default {
    name: 'FeeDetailImport',
    data() {
      return {
        feeDetailImportInfo: {
          importFeeDetails: [],
          feeId: ''
        },
        currentPage: 1,
        pageSize: 10,
        total: 0
      }
    },
    methods: {
      open(params) {
        this.feeDetailImportInfo.feeId = params.feeId
        this._loadFeeDetailImportData(this.currentPage, this.pageSize)
      },
      handleCurrentChange(val) {
        this.currentPage = val
        this._loadFeeDetailImportData(this.currentPage, this.pageSize)
      },
      async _loadFeeDetailImportData(page, row) {
        try {
          const params = {
0b0e0aab   wuxw   费用详情页面开发完成
107
            communityId: getCommunityId(),
f80ea09a   wuxw   加入费用详情
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
            feeId: this.feeDetailImportInfo.feeId,
            page,
            row
          }
          
          const res = await queryImportFeeDetail(params)
          this.feeDetailImportInfo.importFeeDetails = res.data
          this.total = res.records
        } catch (error) {
          console.error('Failed to load import fee data:', error)
        }
      }
    }
  }
  </script>