From 025e46e11cb2962fd7692adfa401333758cc779b Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 02 九月 2025 14:00:34 +0800
Subject: [PATCH] 修改组件
---
src/pages/template.vue | 109 +++++++++++++++++++++++-------------------------------
1 files changed, 46 insertions(+), 63 deletions(-)
diff --git a/src/pages/template.vue b/src/pages/template.vue
index 3f0b7ac..505e971 100644
--- a/src/pages/template.vue
+++ b/src/pages/template.vue
@@ -1,65 +1,48 @@
+<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 list"
- :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>
- <!-- <u-tabbar :list="vuex_tabbar" :mid-button="true"></u-tabbar> -->
+ <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>
- </template>
-
- <script>
- import list from "./template.config.js";
- export default {
- data() {
- return {
- list: list,
- // desc: '鏀堕泦浼楀鐨勫父鐢ㄩ〉闈㈠拰甯冨眬锛屽噺灏戝紑鍙戣�呯殑閲嶅宸ヤ綔锛岃浣犱笓娉ㄩ�昏緫锛屼簨鍗婂姛鍊�'
- }
- },
- computed: {
- getIcon() {
- return path => {
- return '../static/uview/demo/' + path + '.png';
- return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
- }
- },
- },
- methods: {
- openPage(path) {
- this.$u.route({
- url: path
- })
- },
- getGroupTitle(item) {
- return item.groupName
- },
- getFieldTitle(item) {
- return item.title
- }
- }
- }
- </script>
-
- <style>
- /* page {
- background-color: rgb(240, 242, 244);
- } */
- </style>
-
- <style lang="scss" scoped>
- .u-cell-icon {
- width: 36rpx;
- height: 36rpx;
- margin-right: 8rpx;
- }
- </style>
-
\ No newline at end of file
+ <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>
\ No newline at end of file
--
Gitblit v1.9.3