SHZHJCYJPTYWXTAPP/pages/home/start/start.vue

<template>
	<view style="padding-top: 20px;">
		<uni-card>
			<uni-row>
				<uni-col :span="24">
					<uni-card style="background-color: lavender;">
						<view
							style="height: 140px;display: flex;justify-content: center;flex-direction: column;align-items: center;">
							<image class="yj-img" :src="yjxtImgUrl" mode="heightFix"></image>
							<text style="color: black;font-size: 40px;font-weight: 200;;">运维系统</text>
						</view>
						<!-- 			<view style="height: 160px;width: 100%;margin-bottom: 10px;align-items: center;overflow:hidden">
							<image class="yj-img" :src="ywxtImgUrl" mode="heightFix"></image>
						</view> -->
					</uni-card>
				</uni-col>
<!-- 				<uni-col :span="10">
					<view class="tag" style="margin-top: 10px;">
						<view>
							<uni-tag :inverted="true" text="维修直填报" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="设备巡检" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="站点管理" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="统计" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="通讯录" type="primary" />
						</view>
					</view>
				</uni-col> -->
			</uni-row>
			<view class="yw-button" @click="onYwxtClick()">
				<view class="btn-items">
					<uni-icons class="input-uni-icon" type="person" size="18" color="white" />
					<text>进入运维系统</text>
					<uni-icons class="input-uni-icon" type="arrow-right" size="18" color="coral" />
				</view>
			</view>
		</uni-card>
		<uni-card>
			<uni-row>
				<uni-col :span="24">
					<uni-card style="background-color: lavender;">
						<view
							style="height: 140px;display: flex;justify-content: center;flex-direction: column;align-items: center;">
							<!-- <image class="yj-img" :src="yjxtImgUrl" mode="heightFix"></image> -->
							<text style="color: black;font-size: 40px;font-weight: 200;;">应急系统</text>
						</view>
					</uni-card>
				</uni-col>
<!-- 				<uni-col :span="10">
					<view class="tag" style="margin-top: 10px;">
						<view>
							<uni-tag :inverted="true" text="群众登记" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="监测预警" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="危险区动态管理" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="转移避险" type="primary" />
						</view>
						<view>
							<uni-tag :inverted="true" text="巡查检查" type="primary" />
						</view>
					</view>
				</uni-col> -->
			</uni-row>
			<view class="yj-button" @click="onYjxtClick()">
				<view class="btn-items">
					<uni-icons class="input-uni-icon" type="person" size="18" color="white" />
					<text>进入应急系统</text>
					<uni-icons class="input-uni-icon" type="arrow-right" size="18" color="coral" />
				</view>
			</view>
		</uni-card>
	</view>
</template>

<script>
	import {
		img
	} from '@/common/setting';

	export default {
		data() {
			return {
				ywxtImgUrl: 'http://oiyo.oss-cn-beijing.aliyuncs.com/image/source/10d13c8b-4315-11ee-8df3-f0def1489016.jpg?Expires=1708232878&OSSAccessKeyId=LTAI5tPaSKSSyqthdx96Ky7b&Signature=dixmseuqD9XJoPau8ThB8SpS2kk%3D',
				yjxtImgUrl: 'http://oiyo.oss-cn-beijing.aliyuncs.com/image/source/10d13c8b-4315-11ee-8df3-f0def1489016.jpg?Expires=1708232878&OSSAccessKeyId=LTAI5tPaSKSSyqthdx96Ky7b&Signature=dixmseuqD9XJoPau8ThB8SpS2kk%3D',
			}
		},
		created() {},
		methods: {
			onYwxtClick() {
				uni.setStorageSync("SubSystemSelectInfo", {
					subSystem: 1,
				});
				uni.setTabBarItem({
					"index": 1,
					"iconPath": "static/images/tabbar/workbench.png",
					"selectedIconPath": "static/images/tabbar/workbench_selected.png",
					"text": "管理工作台",
				})
				uni.switchTab({
					url: '/pages/home/home'
				})
			},
			onYjxtClick() {
				uni.setStorageSync("SubSystemSelectInfo", {
					subSystem: 2,
				});
				uni.setTabBarItem({
					"index": 1,
					"iconPath": "static/images/tabbar/warn.png",
					"selectedIconPath": "static/images/tabbar/warn_selected.png",
					"text": "监测预警",
				})
				uni.switchTab({
					url: '/pages/home/home'
				})
			},
			// toDangerAreaCheck() {
			// 	uni.navigateTo({
			// 		url: '/pages/yjxt/dangerareacheck?id=&type=0'
			// 	})
			// }
		}
	}
</script>

<style lang="scss">
	.tag {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 10px;
		padding-left: 10px;
		flex-wrap: wrap;

		view {
			margin: 5px;
		}
	}

	.yw-button {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 100%;
		height: 40px;
		margin-left: 5px;
		margin-top: 3px;
		margin-bottom: 3px;
		border-radius: 20px;
		background-color: royalblue;
		padding-left: 20px;

		.btn-items {
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;

			text {
				margin-left: 5px;
				margin-right: 5px;
				color: white;
				font-size: 0.6rem;
			}
		}
	}

	.yw-button:active {
		background-color: gray;
	}

	.yj-img {
		flex-shrink: 0;
		width: auto;
		height: 160px;
	}

	.yj-button {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 100%;
		height: 40px;
		margin-left: 5px;
		margin-top: 3px;
		margin-bottom: 3px;
		border-radius: 20px;
		background-color: royalblue;
		padding-left: 20px;

		.btn-items {
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
         
			text {
				margin-left: 5px;
				margin-right: 5px;
				color: white;
				font-size: 0.6rem;
			}
		}

	}

	.yj-button:active {
		background-color: gray;
	}
</style>