Blame view

src/components/aCommunity/aRoomDetailHisOwner.vue 2.62 KB
b25b036d   wuxw   v1.9 优化日期
1
  <template>
a2547628   wuxw   运营加入房屋详情页面
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
    <div>
      <el-table
        :data="aRoomDetailHisOwnerInfo.owners"
        border
        style="width: 100%; margin-top: 10px"
      >
        <el-table-column prop="name" :label="$t('aRoomDetailHisOwner.ownerName')" align="center" />
        <el-table-column prop="link" :label="$t('aRoomDetailHisOwner.ownerPhone')" align="center" />
        <el-table-column prop="startTime" :label="$t('aRoomDetailHisOwner.startTime')" align="center" />
        <el-table-column prop="endTime" :label="$t('aRoomDetailHisOwner.endTime')" align="center" />
        <el-table-column prop="createTime" :label="$t('aRoomDetailHisOwner.createTime')" align="center" />
        <el-table-column :label="$t('aRoomDetailHisOwner.status')" align="center">
          <template slot-scope="scope">
            {{scope.row.statusCd === '0' ? $t('aRoomDetailHisOwner.active') : $t('aRoomDetailHisOwner.inactive')}}
          </template>
        </el-table-column>
      </el-table>
  
      <el-row class="margin-top">
        <el-col :span="24" class="text-right">
          <el-pagination
            @current-change="handlePageChange"
            :current-page="pagination.currentPage"
            :page-size="pagination.pageSize"
            layout="total, prev, pager, next"
            :total="pagination.total"
          />
        </el-col>
      </el-row>
    </div>
  </template>
  
  <script>
  import { queryAdminRoomHisOwner } from '@/api/aCommunity/aRoomDetailHisOwnerApi'
  
  export default {
    name: 'ARoomDetailHisOwner',
    data() {
      return {
        aRoomDetailHisOwnerInfo: {
          owners: [],
          ownerId: '',
          roomId: ''
        },
        pagination: {
          currentPage: 1,
          pageSize: 10,
          total: 0
        }
      }
    },
    methods: {
      open(data) {
        if (!data.roomId) return
        this.clearData()
        this.aRoomDetailHisOwnerInfo.roomId = data.roomId
        this.loadOwnerData()
      },
      loadOwnerData() {
        const params = {
          page: this.pagination.currentPage,
          row: this.pagination.pageSize,
          roomId: this.aRoomDetailHisOwnerInfo.roomId
        }
  
        queryAdminRoomHisOwner(params).then(response => {
          this.aRoomDetailHisOwnerInfo.owners = response.data
f9f29297   wuxw   v1.9 分页 record 传给...
69
          this.pagination.total = response.total
a2547628   wuxw   运营加入房屋详情页面
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
        }).catch(error => {
          console.error('Failed to load owner history:', error)
        })
      },
      handlePageChange(currentPage) {
        this.pagination.currentPage = currentPage
        this.loadOwnerData()
      },
      clearData() {
        this.aRoomDetailHisOwnerInfo = {
          owners: [],
          ownerId: '',
          roomId: ''
        }
      }
    }
  }
  </script>
  
  <style scoped>
  .margin-top {
    margin-top: 20px;
  }
  .text-right {
    text-align: right;
  }
  </style>