moxuan_takeaway_user/running/cook/cook.vue

<template>
	<view class="container">
		<!-- 监控盒子 -->
		<view class="top">设备离线</view>

		<!-- 店铺信息区域 -->
		<view class="info">
			<view class="info_box">
				店铺名 &nbsp;&nbsp;&nbsp;
				<text class="name">{{ shopName }}</text>
			</view>

			<view class="info_tips">因设备兼容性、网络信号或维护检修等因素，直播可能出现卡顿、加载失败等</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			shopName: '未知'
		}
	},
	onLoad(options) {
		// console.log(options)
		if (options.shopName) {
			this.shopName = options.shopName
		}
	},
	methods: {}
}
</script>

<style lang="scss" scoped>
.container {
	height: 100vh;
	background-color: #ededed;

	.top {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 380rpx;
		color: #fff;
		background-color: #000;
	}

	.info {
		padding: 20rpx;
		margin-top: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;

		.info_box {
			line-height: 70rpx;
			border-bottom: 2rpx solid #ccc;

			.name {
				color: #757575;
			}
		}

		.info_tips {
			margin-top: 10rpx;
			color: #757575;
		}
	}
}
</style>