316 lines
		
	
	
		
			7.2 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
		
		
			
		
	
	
			316 lines
		
	
	
		
			7.2 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
|  | <template> | ||
|  | 	<view class="page"> | ||
|  | 		<u-navbar title="权限操作" :border-bottom="false" :background="bgc" title-color='#000' title-size='36' height='38'></u-navbar> | ||
|  |         <view class="box"> | ||
|  | 			<view class="title"> | ||
|  | 				权限操作 | ||
|  | 			</view> | ||
|  | 			<!-- 代理权限 --> | ||
|  | 			<view class="swlist"> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							允许登录 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							代理登录系统 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							允许提现 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							代理钱包余额提现 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							展示分成比例 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否展示分成比例 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							代理操作 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否展示操作代理 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							设备显示 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否允许设备显示 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							设备操作 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否展示设备操作 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							店铺操作 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否展示店铺操作 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							订单管理 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否允许查看订单 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				 | ||
|  | 				<!-- 商户权限 --> | ||
|  | 				 | ||
|  | 			</view> | ||
|  | 			 | ||
|  | 			<!-- 商家权限 --> | ||
|  | 			<view class="swlist"> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							允许登录 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							代理登录系统 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							允许提现 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							代理钱包余额提现 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							展示分成比例 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否展示分成比例 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							设备管理显示 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否允许设备显示 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="swlist_val"> | ||
|  | 					<view class="lt"> | ||
|  | 						<view class="one"> | ||
|  | 							我的店铺 | ||
|  | 						</view> | ||
|  | 						<view class="two"> | ||
|  | 							是否展示我的店铺 | ||
|  | 						</view> | ||
|  | 					</view> | ||
|  | 					<view class="rt"> | ||
|  | 						<u-switch v-model="checked" active-color="#19CD82 " size="36" inactive-color="#eee"></u-switch> | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 			</view> | ||
|  | 			<view class="baocun"> | ||
|  | 				保存 | ||
|  | 			</view> | ||
|  |         </view> | ||
|  | 	</view> | ||
|  | </template> | ||
|  | 
 | ||
|  | <script> | ||
|  | 	export default { | ||
|  | 		data() { | ||
|  | 			return { | ||
|  |                 checked: false, | ||
|  | 				show:false, | ||
|  | 				bgc: { | ||
|  | 					backgroundColor: " #25CE88", | ||
|  | 				}, | ||
|  | 				 | ||
|  | 			} | ||
|  | 		}, | ||
|  | 		onLoad() { | ||
|  | 		 | ||
|  | 		}, | ||
|  | 		methods: { | ||
|  |             confirm(e){ | ||
|  | 				console.log(e); | ||
|  | 			} | ||
|  | 		} | ||
|  | 	} | ||
|  | </script> | ||
|  | 
 | ||
|  | <style lang="scss"> | ||
|  | 	page { | ||
|  | 		// background: linear-gradient(180deg, #25CE88 0%, rgba(255, 255, 255, 0) 100%);
 | ||
|  | 	} | ||
|  | 
 | ||
|  | 	.page { | ||
|  | 		width: 750rpx; | ||
|  | 		// position: fixed;
 | ||
|  | 		// top: 0;
 | ||
|  | 		// left: 0;
 | ||
|  | 		.box{ | ||
|  | 			width: 750rpx; | ||
|  | 			height: 100%; | ||
|  | 			overflow-y:scroll; | ||
|  | 			background: #F4F5F7; | ||
|  | 			border-radius: 0rpx 0rpx 0rpx 0rpx; | ||
|  | 			padding: 32rpx 36rpx;  | ||
|  | 			box-sizing: border-box; | ||
|  | 			padding-bottom: 100rpx; | ||
|  | 			.baocun{ | ||
|  | 				width: 584rpx;  | ||
|  | 				height: 90rpx; | ||
|  | 				margin: auto; | ||
|  | 				background: linear-gradient( 270deg, #54DAA1 0%, #19CD82 100%); | ||
|  | 				border-radius: 54rpx 54rpx 54rpx 54rpx; | ||
|  | 				margin-top: 62rpx; | ||
|  | 				margin-bottom: 78rpx; | ||
|  | 				font-weight: 500; | ||
|  | 				font-size: 40rpx; | ||
|  | 				color: #FFFFFF; | ||
|  | 				text-align: center; | ||
|  | 				line-height: 90rpx; | ||
|  | 			} | ||
|  | 			.swlist{ | ||
|  | 				margin-top: 34rpx; | ||
|  | 				display: flex; | ||
|  | 				justify-content: space-between; | ||
|  | 				 flex-wrap: wrap; | ||
|  | 				.swlist_val{ | ||
|  | 					display: flex; | ||
|  | 					justify-content: space-between; | ||
|  |                     width: 324rpx; | ||
|  |                     height: 144rpx; | ||
|  |                     background: #FFFFFF; | ||
|  |                     border-radius: 24rpx 24rpx 24rpx 24rpx;		 | ||
|  | 					padding-top: 28rpx; | ||
|  | 					padding-left: 38rpx; | ||
|  | 					box-sizing: border-box; | ||
|  | 					margin-top: 18rpx; | ||
|  | 				} | ||
|  | 				.lt{ | ||
|  | 					.one{ | ||
|  | 						font-size: 28rpx; | ||
|  | 						color: #3D3D3D; | ||
|  | 					} | ||
|  | 					.two{ | ||
|  | 						font-size: 24rpx; | ||
|  | 						color: #808080; | ||
|  | 						margin-top: 12rpx; | ||
|  | 					} | ||
|  | 				} | ||
|  | 				.rt{ | ||
|  | 					margin-top: 24rpx; | ||
|  | 					padding-right: 12rpx; | ||
|  | 				} | ||
|  | 			} | ||
|  | 			.title{ | ||
|  | 				font-size: 32rpx; | ||
|  | 				color: #3D3D3D; | ||
|  | 			} | ||
|  | 			.list{ | ||
|  | 					width: 680rpx; | ||
|  | 					height: 578rpx; | ||
|  | 					background: #FFFFFF; | ||
|  | 					border-radius: 24rpx 24rpx 24rpx 24rpx; | ||
|  | 					padding: 46rpx 36rpx; | ||
|  | 					box-sizing: border-box; | ||
|  | 					margin-top: 34rpx; | ||
|  | 					margin-bottom: 47rpx; | ||
|  | 				.list_val{ | ||
|  | 					display: flex; | ||
|  | 					font-size: 32rpx; | ||
|  | 					color: #3D3D3D; | ||
|  | 					justify-content: space-between; | ||
|  | 					margin-bottom: 32rpx; | ||
|  | 					input{ | ||
|  | 						width: 430rpx; | ||
|  | 						height: 70rpx; | ||
|  | 						background: #F0F0F0; | ||
|  | 						border-radius: 12rpx 12rpx 12rpx 12rpx; | ||
|  | 						padding-left: 32rpx; | ||
|  | 						box-sizing: border-box; | ||
|  | 						font-size: 28rpx; | ||
|  | 						color: #808080; | ||
|  | 					} | ||
|  | 				} | ||
|  | 			} | ||
|  | 		} | ||
|  | 	} | ||
|  | </style> |