From 682182cf67a5aa9fed34335fea22d4673f30f10c Mon Sep 17 00:00:00 2001
From: Mr.Shi <1878285526@qq.com>
Date: 星期一, 04 九月 2023 11:59:44 +0800
Subject: [PATCH] 小程序
---
minipro_standard/pages/workbench/workbench.vue | 142 +++++++++++++++++++++++++++++++++++++++++++++--
1 files changed, 135 insertions(+), 7 deletions(-)
diff --git a/minipro_standard/pages/workbench/workbench.vue b/minipro_standard/pages/workbench/workbench.vue
index 8d77569..fa678a3 100644
--- a/minipro_standard/pages/workbench/workbench.vue
+++ b/minipro_standard/pages/workbench/workbench.vue
@@ -1,20 +1,67 @@
<template>
- <view>
-
+ <view class="index">
+ <view class="menu">
+ <view class="menu_list" v-for="(row, i) in Menu" :key="i">
+ <view class="menu_list_head">
+ <span>{{row.label}}</span>
+ </view>
+ <div class="menu_list_list">
+ <view class="menu_list_item" v-for="item in row.children" :key="item.id" @click="jump(item)">
+ <image :src="item.icon" mode="widthFix" />
+ <span>{{item.label}}</span>
+ </view>
+ <view class="menu_list_zw"></view>
+ <view class="menu_list_zw"></view>
+ <view class="menu_list_zw"></view>
+ </div>
+ </view>
+ </view>
<myTabbar :index="1" />
</view>
</template>
<script>
- import myTabbar from "@/components/myTabber.vue"
+ import myTabbar from "@/components/myTabber.vue"
+ import { mapState } from 'vuex'
export default {
components: {
myTabbar
},
+ computed: mapState([
+ 'Menu'
+ ]),
+ onReady() {
+ console.log(this.Menu)
+ },
data() {
return {
-
+ list: [
+ {
+ icon: require('@/static/logo@2x.png'),
+ label: '娴嬭瘯'
+ },
+ {
+ icon: require('@/static/logo@2x.png'),
+ label: '娴嬭瘯'
+ },
+ {
+ icon: require('@/static/logo@2x.png'),
+ label: '娴嬭瘯'
+ },
+ {
+ icon: require('@/static/logo@2x.png'),
+ label: '娴嬭瘯'
+ },
+ {
+ icon: require('@/static/logo@2x.png'),
+ label: '娴嬭瘯'
+ },
+ {
+ icon: require('@/static/logo@2x.png'),
+ label: '娴嬭瘯'
+ }
+ ]
};
},
onLoad() {
@@ -49,7 +96,88 @@
}
}
</script>
-
-<style lang="scss">
-
+<style>
+ page {
+ background-color: #F7F7F7 !important;
+ }
+</style>
+<style scoped lang="scss">
+.index {
+ width: 100%;
+ .menu {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ .menu_list {
+ display: flex;
+ flex-direction: column;
+ padding: 30rpx;
+ box-sizing: border-box;
+ margin-bottom: 20rpx;
+ background: white;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .menu_list_head {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 40rpx;
+ span {
+ font-size: 32rpx;
+ font-family: PingFangSC-Medium, PingFang SC;
+ font-weight: 500;
+ color: #222222;
+ }
+ }
+ .menu_list_list {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+ justify-content: space-between;
+ .menu_list_zw {
+ width: 20%;
+ height: 0;
+ }
+ .menu_list_item {
+ width: 20%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ margin-top: 40rpx;
+ &:nth-child(1) {
+ margin: 0;
+ }
+ &:nth-child(2) {
+ margin: 0;
+ }
+ &:nth-child(3) {
+ margin: 0;
+ }
+ &:nth-child(4) {
+ margin: 0;
+ }
+ &:nth-child(5) {
+ margin: 0;
+ }
+ image {
+ width: 88rpx;
+ height: 88rpx;
+ border-radius: 24rpx;
+ overflow: hidden;
+ }
+ span {
+ font-size: 24rpx;
+ font-weight: 400;
+ color: #333333;
+ margin-top: 16rpx;
+ }
+ }
+ }
+ }
+ }
+}
</style>
--
Gitblit v1.9.3