<template>
	<view class="system-message">
		<view class="system-message-main">
			<view class="system-message-main-top">
				<view class="system-message-title">
					<view class="">客户下单</view>
					<view class="dian"></view>
				</view>
				<view class="system-message-subtitle">50分钟前</view>
			</view>
			<view class="system-message-contant">老板，您的空闲设备海德堡SD-1有新的报价订单发布了，赶紧去报价吧！</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {}
	},
	methods: {}
}
</script>

<style lang="scss">
.system-message {
	.system-message-main {
		background-color: #ffffff;
		margin: 20rpx 32rpx;
		border-radius: 20rpx;
	}
	.system-message-main-top {
		display: flex;
		justify-content: space-between;
		padding: 24rpx 32rpx;
	}
	.system-message-title {
		font-size: 32rpx;
		color: #333333;
		letter-spacing: 0;
		font-weight: 600;
		display: flex;
	}
	.system-message-subtitle {
		font-size: 24rpx;
		color: #333333;
		font-weight: 400;
	}
	.system-message-contant {
		font-size: 28rpx;
		color: #888888;
		letter-spacing: 0;
		font-weight: 400;
		padding: 0rpx 32rpx;
		line-height: 40rpx;
		overflow: auto;
		max-height: 100rpx;
		height: 100rpx;
	}
	.dian {
		background: #FF0000 ;
		height: 14rpx;
		width: 14rpx;
		border-radius: 20rpx;
		margin-left: 10rpx;
	}
}
</style>
