109 lines
2.6 KiB
Vue
109 lines
2.6 KiB
Vue
<template>
|
|
<view class="page">
|
|
<custom-navbar title="建制" />
|
|
<tile-grid :tile-image="CommonEnum.TILE" />
|
|
<view class="header">
|
|
<!-- 状态展示 -->
|
|
<status-display
|
|
v-if="loading"
|
|
type="loading"
|
|
loading-text="加载中..."
|
|
/>
|
|
<status-display
|
|
v-else-if="institutionalData.length === 0"
|
|
type="empty"
|
|
empty-text="暂无数据"
|
|
/>
|
|
<!-- 数据列表 -->
|
|
<institutional-item
|
|
v-else
|
|
v-for="(item, index) in institutionalData"
|
|
:key="index"
|
|
:item="item"
|
|
:index="index"
|
|
@view-detail="handleViewDetail"
|
|
/>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { tilesImageEnum } from '@/enum/institutionalStructure.js';
|
|
import { getInstitutionalList } from '@/api/institutionalStructure.js';
|
|
import CustomNavbar from "../../components/custom-navbar/custom-navbar.vue";
|
|
import TileGrid from "../../components/tile-grid/tile-grid.vue";
|
|
import InstitutionalItem from "./components/institutional-item.vue";
|
|
import StatusDisplay from "../../components/status-display/status-display.vue";
|
|
import { InstitutionalDataFormatter } from "./utils/data-formatter.js";
|
|
import { dataManagerMixin } from "./mixins/data-manager.js";
|
|
import CommonEnum from "../../enum/common";
|
|
|
|
export default {
|
|
mixins: [dataManagerMixin],
|
|
components: {
|
|
CustomNavbar,
|
|
TileGrid,
|
|
InstitutionalItem,
|
|
StatusDisplay
|
|
},
|
|
data() {
|
|
return {
|
|
CommonEnum,
|
|
bgc: {
|
|
backgroundColor: CommonEnum.BASE_COLOR,
|
|
},
|
|
tilesImageEnum,
|
|
// 动态数据数组
|
|
institutionalData: []
|
|
}
|
|
},
|
|
onLoad() {
|
|
// 页面加载时获取数据
|
|
this.getInstitutionalData()
|
|
},
|
|
methods: {
|
|
// 获取建制数据
|
|
async getInstitutionalData(isLoadMore = false) {
|
|
await this.fetchData(
|
|
isLoadMore,
|
|
getInstitutionalList,
|
|
InstitutionalDataFormatter.transformData
|
|
)
|
|
// 将数据赋值给 institutionalData
|
|
this.institutionalData = this.dataList
|
|
},
|
|
|
|
// 刷新数据
|
|
refreshData() {
|
|
this.getInstitutionalData()
|
|
},
|
|
|
|
// 处理查看详细
|
|
handleViewDetail(data) {
|
|
console.log('查看详细:', data.item)
|
|
// 这里可以添加跳转到详情页面的逻辑
|
|
uni.showToast({
|
|
title: '查看详细功能开发中',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background: #F5F0E7;
|
|
}
|
|
.header {
|
|
width: 100%;
|
|
min-height: 100vh;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
background-color: #FFFBF5;
|
|
padding: 0 15rpx;
|
|
padding-bottom: 40rpx;
|
|
}
|
|
</style> |