lxp_Maxcess/pages/main/home.vue

<template>
	<view class="app status-bar-gap">
		<view class="page">
			<l-header :title="t('tab.home')" sticky #left>
				<view></view>
			</l-header>
			<view class="type-bc">
				<!-- 珠海模块 -->
				<template v-if="state.patternId === '101'">
					<view class="type-item type-item-hy" @tap="toPages('/pages/verify/index')">
						<view class="type-item-text">{{ t('home.llyz') }}</view>
					</view>
					<view class="type-item type-item-jz" @tap="toPages('/pages/purchase/index')">
						<view class="type-item-text">{{ t('home.cgrk') }}</view>
					</view>
				</template>
				<!-- 泰国模块 -->
				<template  v-if="state.patternId === '103'">
					<view class="type-item type-item-hy" @tap="toPages('/pages/verifyTa/index')">
						<view class="type-item-text">{{ t('home.llyz') }}</view>
					</view>
					<view class="type-item type-item-jz" @tap="toPages('/pages/purchaseTa/index')">
						<view class="type-item-text">{{ t('home.cgrk') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/material/index')">
						<view class="type-item-text">{{ t('home.scfl') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/supplement/index')">
						<view class="type-item-text">{{ t('home.scbl') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/returnMaterials/index')">
						<view class="type-item-text">{{ t('home.sctl') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/ruleClaim/index')">
						<view class="type-item-text">{{ t('index.ctll') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/ruleValidation/index')">
						<view class="type-item-text">{{ t('index.ctllyz') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/putInProd/index')">
						<view class="type-item-text">{{ t('home.sctc') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/encasement/index')">
						<view class="type-item-text">{{ t('home.sczx') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/productionStorage/index')">
						<view class="type-item-text">{{ t('home.scrk') }}</view>
					</view>
					<view class="type-item type-item-hl" @tap="toPages('/pages/outOftock/index')">
						<view class="type-item-text">{{ t('home.xxck') }}</view>
					</view>
				</template>
			</view>
		</view>
		<u-overlay :show="state.typeBoxShow" @click="state.typeBoxShow = false">
			<view class="typeBox">
				<view class="btn-item" @click="toPages('/pages/putInProd/index',{type:'1'})">{{ t('home.kssc') }}</view>
				<view class="btn-item" @click="toPages('/pages/putInProd/index',{type:'3'})">{{ t('home.kscs') }}</view>
				<view class="btn-item" @click="toPages('/pages/putInProd/index',{type:'2'})">{{ t('home.kshb') }}</view>
			</view>
		</u-overlay>
	</view>
</template>

<script lang="ts" setup>
	import { reactive, nextTick } from 'vue';
	import { onLoad, onShow, onReachBottom } from '@dcloudio/uni-app'
	import { useI18n } from 'vue-i18n'
	const getI18n = useI18n()
	const { t, locale } = getI18n
	const state = reactive({
		carouselList: [],
		typeBoxShow:false,
		appConfig:{},
		patternId:''
	})

	onShow(() => {
		state.appConfig = uni.getStorageSync('appLoginInfo')
		state.patternId = state.appConfig.organizationObj['FOrgOrgId.FNumber']
		console.log(state.patternId);
	})
	const toPages = (url : string, data : any = {}) => {
		uni.$u.route({
			url: url,
			params: data
		})
	}
</script>

<style lang="scss">
	.typeBox {
		position: absolute;
		bottom: 120rpx;
		width: 100vw;
		.btn-item {
			width: 80vw;
			margin: 32rpx auto;
			padding: 24rpx;
			display: flex;
			background-color: white;
			align-items: center;
			justify-content: center;
			border-radius: 12rpx;
		}
	}

	.app {
		background-color: #F5F5F5;

		.page {
			padding: 18px 32rpx;
		}

		.home-top {
			display: flex;

			.searching {
				margin: 20rpx 0;
				width: 614rpx;
				height: 68rpx;
				background-color: #FFFFFF;
				border-radius: 44rpx;
				box-sizing: border-box;
				padding: 20rpx;
				display: flex;
				align-items: center;
			}

			.message-icon {
				flex: 1;
				display: flex;
				align-items: center;
				justify-content: flex-end;
			}
		}

		.carousel {
			margin-top: 10rpx;

			.swiper-wrapper {
				width: 100%;
				height: 400rpx;
				border-radius: 28rpx;
				overflow: hidden;

				&__item {
					width: 100%;
					height: 400rpx;
					border-radius: 28rpx;
				}
			}

			.grid-wrapper {
				margin: 32rpx 0;

				&__icon {
					width: 84rpx;
					height: 84rpx;
				}

				&__text {
					font-size: 26rpx;
				}
			}

			.subject-title {
				font-size: 32rpx;
				font-weight: 500;
				color: #353635;
				font-family: Medium;
			}
		}

		.type-bc {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			// margin-top: 120rpx;

			.type-item {
				width: 330rpx;
				height: 176rpx;
				background-repeat: no-repeat;
				background-size: 100% 100%;
				background-position: center;
				margin-bottom: 24rpx;
				border-radius: 22rpx;
			}

			.type-item-text {
				color: white;
				font-weight: 600;
				font-size: 36rpx;
				font-family: PingFang SC;
				margin: 24rpx;
			}

			.type-item-gc {
				background-image: url(../../static/bc/homeBcItem.png);
			}

			.type-item-hy {
				background-image: url(../../static/bc/homeBcItem.png);
			}

			.type-item-jz {
				background-image: url(../../static/bc/homeBcItem.png);
			}

			.type-item-hl {
				background-image: url(../../static/bc/homeBcItem.png);
			}
		}

		.Advertising {
			width: 100%;
			height: 176rpx;
			background-repeat: no-repeat;
			background-image: url(../../static/bc/home-gg.png);
			//background-attachment: fixed;
			background-size: contain;
			background-position: center;
			margin-bottom: 24rpx;
		}
	}
</style>