选择页面

src/assets/css/xpwyfyy.css

@@ -200,6 +200,9 @@ body {
 	.mui-input-group .mui-input-row p {
 		font-size: 14px
 	}
+	.mui-content .vongi-choose .mui-table-view-cell a{
+		padding:11px 15px
+	}
 }
 
 .bindfyy-btn button {
@@ -790,3 +793,42 @@ h3 {
 	padding:10px;
 	border-radius: 4px;
 }
+.vongi-choose-yq{
+	background:url(../img/blue.png) no-repeat center;	
+}
+.vongi-choose-zz{
+	background:url(../img/green.png) no-repeat center;	
+}
+.vongi-choose-yl{
+	background:url(../img/red.png) no-repeat center;	
+}
+.vongi-choose .mui-media-body,
+.vongi-choose .mui-media-body p,
+.vongi-choose .mui-navigate-right:after, .vongi-choose .mui-push-left:after, .vongi-choose .mui-push-right:after{
+	color:#ffffff
+}
+.vongi-choose{
+	padding:30px
+}
+.vongi-choose .mui-table-view{
+	background:0
+}
+.vongi-choose .mui-table-view-cell{
+	margin-top:15px;
+	background-size:100% 100%;
+	border-radius: 7px;
+}
+
+.vongi-choose .mui-media-body p{
+	margin-top:5px
+}
+.vongi-choose .mui-table-view-cell a{
+	padding:20px 15px
+}
+.vongi-choose h5{
+	line-height: 1.4;
+}
+.vongi-choose h1{
+	text-align: center;
+	margin-bottom:10px
+}

src/projects/home/views/Role.vue

@@ -1,6 +1,46 @@
 <template>
 	<div>
-		role
+		<header class="mui-bar mui-bar-nav">
+			<h1 class="mui-title">选择行业</h1>
+		</header>
+		<div class="mui-content margin60">
+			<div class="vongi-choose">
+				<h1>选择行业</h1>
+				<h5>“小鹏管家”是智慧物业、智慧园区、智慧养老的云管家，111111是智慧生活的守护神。管家服务于访客、园区（包括小区、养老院、企事业单位、厂区）人员及管理者。主要功能包括出入管理、健康监管、考勤打卡、物业管理、园区安全管理、访客管理以及在线缴费等。</h5>
+				<ul class="mui-table-view">
+					<li class="mui-table-view-cell mui-media vongi-choose-yq">
+						<a class="mui-navigate-right">
+							<img class="mui-media-object mui-pull-left" src="~$project/assets/img/icon02.png">
+							<div class="mui-media-body">
+								工厂园区
+								<p class='mui-ellipsis'>适用于办公楼、工厂、工业园等场所</p>
+							</div>
+						</a>
+					</li>
+					<li class="mui-table-view-cell mui-media vongi-choose-zz">
+						<a class="mui-navigate-right">
+							<img class="mui-media-object mui-pull-left" src="~$project/assets/img/icon02.png">
+							<div class="mui-media-body">
+								社区住宅
+								<p class='mui-ellipsis'>适用于社区、小区、公寓等场所</p>
+							</div>
+						</a>
+					</li>
+					<li class="mui-table-view-cell mui-media vongi-choose-yl">
+						<a class="mui-navigate-right">
+							<img class="mui-media-object mui-pull-left" src="~$project/assets/img/icon02.png">
+							<div class="mui-media-body">
+								养老院
+								<p class='mui-ellipsis'>适用于养老机构</p>
+							</div>
+						</a>
+					</li>
+				</ul>
+			</div>
+		</div>
+		<div class="fyy-footer">
+			<div class="bindfyy-btn"><button type="submit" class="mui-btn mui-btn-outlined">我是访客</button></div>
+		</div>
 	</div>
 </template>
 
@@ -12,5 +52,6 @@
 </script>
 
 <style scoped src="$project/assets/css/iconfont.css"></style>
+<style scoped src="$project/assets/css/spwyfyy.css"></style>
 <style scoped>
 </style>