index.vue 3.38 KB
<template>
	<view class="menu">
		<view class="menu-box u-f u-f-row u-f-wrap u-f-jcsb menu-1">
			<view class="item-box u-f u-f-column u-f-jcc u-f-aic" v-for="(item,i) in dataList" :key="i" @tap="goSearch(item.tit)">
				<view class="num">
					<text class="color-1" v-if="item.tit=='今日任务数'">{{item.num}}</text><text class="color-2" v-else-if="item.tit=='今日入库数'">{{item.num}}</text><text class="color-3" v-else>{{item.num}}</text>
				</view>

				<view class="tit u-f u-f-jcc u-f-aic">
					<text>{{item.tit}}</text>
				</view>
			</view>
		</view>

		<view class="menu-box menu-2 u-f u-f-row u-f-wrap u-jcsb">
			<view class="item-box content" v-for="(item,i) in menuList" :key="i" @tap="goMenu(item.tit)">
				<image :src="item.img" mode=""></image>
				<view class="tit">
					<text>{{item.tit}}</text>
				</view>
			</view>
		</view>

	</view>

</template>

<script>
	export default {

		data() {
			return {
				dataList: [],
				menuList: [

					{
						img: '/static/img/index/receipt.png',
						tit: '入库'
					},
					{
						img: '/static/img/index/shipment.png',
						tit: '出库'
					},
					{
						img: '/static/img/index/task.png',
						tit: '任务'
					},
					{
						img: '/static/img/index/inventory.png',
						tit: '库存'
					},
					{
						img: '/static/img/index/check.png',
						tit: '盘点'
					},
					{
						img: '/static/img/index/material.png',
						tit: '物料'
					},
				
				],

			}
		},
		onLoad() { 
            this.getTask();
		},
		methods: {
			//
			goMenu(value) {
				console.log(value)
				if(value == '入库') {
					uni.navigateTo({
						url: '/pages/receipt/receipt'
					})
				}	
			},
			getTask() {
				let data = {
					companyCode:uni.getStorageSync('userData').companies.toString()
				}
				this.$http.task.searchTodayInfo(data).then(res => {
					console.log(res)
					let {todayReceipt,todayShipment,todayTAask} = res.data;
					this.dataList= [
					
						{
							num: todayTAask || 0,
							tit: '今日任务数'
						},
						{
							num: todayReceipt || 0,
							tit: '今日入库数'
						},
						{
							num: todayShipment || 0,
							tit: '今日出库数'
						}
					];
				})
			},
			goSearch(tit) {
				if(tit == "今日任务") {
					uni.navigateTo({
						url:""
					})
				} else if(tit == "今日入库数") {
					uni.navigateTo({
						url:""
					})
				} else {
					uni.navigateTo({
						url:""
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>

	// page {
	// 	background-color: #fff;
	// }
	.menu {
       
		margin-top: 2rpx;

		.menu-box {
			background: #ffffff;
			padding: 24rpx 30rpx;

			.item-box {

				width: 33.33333%;

				&.content {

					margin: 40rpx 0rpx 60rpx;
					text-align: center;
				}

				image {
					width: 80rpx;
					height: 80rpx;
				}

				.num {
					font-size: 32rpx;
					.color-1 {
						color: $uni-color-error;
					}
					.color-2 {
						color: $uni-color-warning;
					}
					.color-3 {
						color: $uni-color-success;
					}
				}

				.tit {

					font-size: 32rpx;
					margin-top: 12rpx;
					color: #333333;
					padding: 4rpx 0rpx;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.active {
					color: #ffffff;
					background-color: #999999;
					border-radius: 120rpx;
				}
			}

		}
     
		.menu-2 {
			border-top: 40rpx solid #f2f2f2;
		}
		.menu-1 {
			border-top: 2rpx solid #f2f2f2;
		}
	}
</style>