| | |
| | | <template> |
| | | <view> |
| | | <scroll-view scroll-y> |
| | | <view class="flex justify-end custom-position"> |
| | | <view> |
| | | <image class="img-logo flex solid-bottom " src="../../static/zoneyung.png" mode="widthFix"></image> |
| | | </view> |
| | | </view> |
| | | <view class="nav-list" > |
| | | <navigator hover-class="none" :url="'/pages/basics/' + item.name" class="nav-li" navigateTo :class="'bg-'+item.color" |
| | | :style="[{animation: 'show ' + ((index+1)*0.2+1) + 's 1'}]" v-for="(item,index) in elements" :key="index" @click="checked()"> |
| | | <view class="nav-title">{{item.title}}</view> |
| | | <view class="nav-name">{{item.name}}</view> |
| | | <text :class="'cuIcon-' + item.cuIcon"></text> |
| | | </navigator> |
| | | </view> |
| | | </scroll-view> |
| | | <view class="content"> |
| | | <image class="logo" src="/static/logo.png"></image> |
| | | <view class="text-area"> |
| | | <text class="title">{{title}}</text> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | |
| | | export default { |
| | | data() { |
| | | return { |
| | | elements:[ |
| | | |
| | | { |
| | | title: '组托入库', |
| | | name: 'pakin', |
| | | color: 'blue', |
| | | cuIcon: 'copy' |
| | | }, |
| | | { |
| | | title: '订单组托', |
| | | name: 'order', |
| | | color: 'blue', |
| | | cuIcon: 'goods' |
| | | }, |
| | | { |
| | | title: '库存查询', |
| | | name: 'stockQuery', |
| | | color: 'blue', |
| | | cuIcon: 'searchlist' |
| | | }, |
| | | { |
| | | title: '库存盘点', |
| | | name: 'stockCheck', |
| | | color: 'blue', |
| | | cuIcon: 'safe' |
| | | }, |
| | | { |
| | | title: '退出登录', |
| | | name: 'logOut', |
| | | color: 'grey', |
| | | cuIcon: 'exit' |
| | | }, |
| | | |
| | | ] |
| | | title: 'Hello' |
| | | } |
| | | }, |
| | | onLoad() { |
| | | |
| | | }, |
| | | methods: { |
| | | changeImg(){ |
| | | console.log(1) |
| | | }, |
| | | checked() { |
| | | uni.vibrateShort(); |
| | | } |
| | | |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style> |
| | | @import "../../colorui/main.css"; |
| | | @import "../../colorui/icon.css"; |
| | | |
| | | .custom-position { |
| | | margin: 10rpx 10rpx 50rpx 0rpx; |
| | | .content { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | .img-logo { |
| | | width: 150rpx; |
| | | |
| | | .logo { |
| | | height: 200rpx; |
| | | width: 200rpx; |
| | | margin-top: 200rpx; |
| | | margin-left: auto; |
| | | margin-right: auto; |
| | | margin-bottom: 50rpx; |
| | | } |
| | | |
| | | .text-area { |
| | | display: flex; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .title { |
| | | font-size: 36rpx; |
| | | color: #8f8f94; |
| | | } |
| | | </style> |