对比新文件 |
| | |
| | | <script setup lang="ts"> |
| | | import tab from "@/plugins/tab"; |
| | | import list from "./template.config.js"; |
| | | |
| | | interface ListItem { |
| | | groupName: string; |
| | | list: FieldItem[]; |
| | | } |
| | | |
| | | interface FieldItem { |
| | | title: string; |
| | | icon: string; |
| | | path: string; |
| | | } |
| | | |
| | | const listData = list as ListItem[]; |
| | | const getIcon = (path: string) => `../static/uview/demo/${path}.png`; |
| | | const openPage = (path: string) => tab.navigateTo(path) |
| | | const getGroupTitle = (item: ListItem) => item.groupName; |
| | | const getFieldTitle = (item: FieldItem) => item.title; |
| | | </script> |
| | | <template> |
| | | <view class="wrap"> |
| | | <view class="list-wrap"> |
| | | <u-cell-group title-bg-color="rgb(243, 244, 246)" :title="getGroupTitle(item)" v-for="(item, index) in listData" |
| | | :key="index"> |
| | | <u-cell :titleStyle="{ fontWeight: 500 }" @click="openPage(item1.path)" :title="getFieldTitle(item1)" |
| | | v-for="(item1, index1) in item.list" :key="index1"> |
| | | <template v-slot:icon> |
| | | <image class="u-cell-icon" :src="getIcon(item1.icon)" mode="widthFix"></image> |
| | | </template> |
| | | </u-cell> |
| | | </u-cell-group> |
| | | </view> |
| | | <u-gap height="70"></u-gap> |
| | | </view> |
| | | </template> |
| | | <style lang="scss" scoped> |
| | | page { |
| | | background-color: rgb(240, 242, 244); |
| | | } |
| | | |
| | | .u-cell-icon { |
| | | width: 36rpx; |
| | | height: 36rpx; |
| | | margin-right: 8rpx; |
| | | } |
| | | </style> |