zhuoxin-leader-uniapp/pages/index/accessory.vue

<template>
	<view class="content">
		<fxyk-navbar :isSearch="false" title="附件" />
		<view class="d-flex a-center flex-wrap content__box">
			<view class="content__box__item">
			  	<fxyk-button style="font-size: 21rpx;
			  						line-height: 27rpx;
			  						color: #848484;
									margin:0;"
			  				 width="104" 
			  				 height="104" 
			  				 bgColor="#E5E9ED" 
			  				 content="添加附件" />
			 </view>  
			<view class="content__box__item">
				<fxyk-button style="font-size: 21rpx;
									line-height: 27rpx;
									color: #848484;
									margin:0;"
							 width="104" 
							 height="104" 
							 bgColor="#E5E9ED" 
							 content="添加附件" />
			 </view>  
			 <view class="content__box__item">
				 <fxyk-button style="font-size: 21rpx;
				 					line-height: 27rpx;
				 					color: #848484;
									margin:0;"
				 			 width="104" 
				 			 height="104" 
				 			 bgColor="#E5E9ED" 
				 			 content="添加附件" />
			  </view>  
		</view>
		<fxyk-button content="确认" width="238"/>
	</view>
</template>

<script>
</script>

<style lang="scss" scoped>
	page {
		width: 100%;
		height: 100%;
	}
	.content {
		width: 100%;
		height: 100%;
		min-height: 100vh;
		background-color: $yk-bg-color;
		&__box {
			margin-top:77rpx;
			padding: 0 35rpx;
			&__item {
				display: flex;
				align-items: center;
				justify-content: center;
				width:313rpx;
				height: 229rpx;
				border: 1rpx solid #D6D3D6;
				background-color: #fff;
				box-sizing: border-box;
				margin-bottom: 25rpx;
			}
			:nth-child(odd){
				margin-right: 50rpx;
			}
		}
	}
</style>