Home Explore Help
Register Sign In
bulomakaka
/
ekexiu.app
Watch 2
Star 1
Fork 0
Code Issues 0 Pull Requests 0 Commits 19 Releases 0 Wiki
Browse Source

修改筛选条件的样式

luyanan 8 years ago
parent
dd12867cbb
commit
ebeb2c2fca
7 changed files with 374 additions and 163 deletions
Split View Show Diff Stats
  1. 46 14
      app/css/app.css
  2. 25 4
      app/html/attentions.html
  3. 16 16
      app/html/consultlist.html
  4. 5 5
      app/html/proinforupdate.html
  5. 79 0
      app/html/resinforupdate.html
  6. 124 41
      app/html/search-pro.html
  7. 79 83
      app/html/search-res.html

+ 46 - 14
app/css/app.css
View File 

@ -7,6 +7,8 @@
7 7 
/*.mui-table-view-cell .mui-media-body{padding-bottom:10px; border-bottom:1px solid #CCCCCC;}*/
8 8 
.mui-input-group .mui-input-row:last-child:after{ background: none;}
9 9
10 
.mui-popover{ border-radius:0;}
11
10 12 
a{text-decoration:none;color:#007aff}a:active{color:#0062cc}
11 13 
.mui-btn.mui-active:enabled,.mui-btn:enabled:active,button.mui-active:enabled,button:enabled:active,input[type=button].mui-active:enabled,input[type=button]:enabled:active,input[type=reset].mui-active:enabled,input[type=reset]:enabled:active,input[type=submit].mui-active:enabled,input[type=submit]:enabled:active{color:#fff;background-color:#FF9900}
12 14 
/*///////////////common公共样式///////////////////////*/

@ -64,7 +66,7 @@ body{ color: #666666; font-size:14px;}
64 66 
.frmactive2{color:#fff;background-color:#ccc; border:1px solid transparent;}
65 67 
.frmactive{color:#fff;background-color:#FF9900; border:1px solid #FF9900;}
66 68 
.frmactiveok{color:#fff;background-color:#FF9900; border:1px solid #FF9900;}
67 
.exitbtn{ border:none; margin: 0; color:#FF0000; border-radius: 0;}
69 
.exitbtn{ border:none; margin: 0; color:#FF0000; font-size: 14px; border-radius: 0;}
68 70
69 71 
.pompmsg{ font-size: 12px; color: #CCCCCC;}
70 72 
/*///////////////common公共样式///////////////////////*/

@ -134,12 +136,14 @@ body{ color: #666666; font-size:14px;}
134 136 
/*.searchbox{position: relative;}
135 137 
.searchbox .searchtxt{ position: absolute; height: 30px; top:50%; margin-top:-13px; border-radius: 6px; border:1px transparent solid; padding:0 30px; line-height: 20px; font-size: 14px;}
136 138 
*/
137 
.searchbox .mui-placeholder .mui-icon-search{font-size:20px; color: #999999;}
139 
.searchbox .mui-placeholder .mui-icon-search{font-size:18px; color: #999999;}
138 140 
.mui-search input[type=search].searchtxt{background: #FFFFFF;}
141 
.mui-search .mui-placeholder{ font-size: 14px; top:2px }
142
139 143 
.maintitbox .maintit{ line-height: 40px; font-size: 16px; text-align: center; color: #FF9900; border-bottom: 1px solid #F0F0F0;}
140 144 
.conblock{ background: #FFFFFF; margin:10px 0;}
141 145 
.mui-grid-view.gridbg{ background: #FFFFFF; border: none;}
142 
.mui-grid-view.gridbg .mui-table-view-cell{ border:none;}
146 
.mui-grid-view.gridbg .mui-table-view-cell{ border:none; padding: 10px 4px;}
143 147 
.mui-grid-view.gridbg .mui-table-view-cell .mui-media-body{ font-size: 12px;}
144 148 
/*热门领域*/
145 149 
.fieldicon{ overflow: hidden;width:40px; height:40px;margin: auto;}

@ -231,7 +235,7 @@ body{ color: #666666; font-size:14px;}
231 235 
/*我的关注*/
232 236 
.fixbox{ background: #FFFFFF;}
233 237 
.fixbox .fixbtn{ padding:0; margin: 0; overflow: hidden;}
234 
.fixbox .fixbtn li{ list-style: none; float: left; padding:10px; border:1px solid #F0F0F0; width:50%;text-align: center;}
238 
.fixbox .fixbtn li{ list-style: none; float: left; padding:6px 10px; border:1px solid #F0F0F0; width:50%;text-align: center;font-size: 14px;height: 32px;}
235 239 
.fixbox .fixbtn li.liactive{ color: #FF9900;border-bottom-color: #FF9900;}
236 240 
.childlist{ display: none;}
237 241 
/*合作历史及评价*/

@ -274,11 +278,16 @@ body{ color: #666666; font-size:14px;}
274 278 
/***********************专家信息修改*******************/
275 279
276 280 
/***********************搜索*******************/
277 
.searchbox2{background: #FFFFFF; border-radius: 6px; height: 30px;  margin:8px 0;overflow: hidden;}
278 
.searchbox2 .searchselect{width: 20%; position:relative;}
279 
.searchbox2 .searchselect .mui-select{width:100%; padding:8% 10%; padding-left:18%;margin: auto; background: none;}
280 
.searchbox2 .searchselect em{position: absolute; right:30%; top:-8%; font-size: 16px; width: 0; height: 0; z-index: 0;}
281 
.searchbox2 .searchtxt2{width: 80%;height: 22px; margin: 4px 0; line-height: 20px; border: none; border-radius: 0; border-left:1px solid #CCCCCC; font-size:14px;}
281 
.searchbox2{width:92%;background: #FFFFFF; border-radius: 6px; height: 30px;  margin:8px 0;/*overflow: hidden;*/}
282 
.searchbox2 .searchselect{width: 24%; position:relative;}
283 
/*.searchbox2 .searchselect .mui-select{width:100%; padding:8% 10%; padding-left:18%;margin: auto; background: none;}*/
284 
.searchbox2 .searchselect em{position: absolute; right:30%; top:-8%; font-size: 16px;color:#999999; width: 0; height: 0; z-index: 0;}
285 
.searchbox2 .searchtxt2{width: 76%;height: 22px; margin: 6px 0; line-height: 20px; border: none; border-radius: 0; border-left:1px solid #CCCCCC; font-size:13px;}
286 
.simuselect{position:relative;}
287 
.ulbox{ padding: 0 16px;font-size: 13px;color:#999999;line-height: 32px;cursor:pointer; position:relative;}
288 
.lishow{ padding:0; margin:0;background:#fff;overflow: hidden; border-radius:2px;position:absolute; top:30px;right:0px; width:100%;box-shadow: 0px 0px 3px #ccc inset;z-index: 9999;display:none;}
289 
.lishow li{list-style: none; font-size: 13px;line-height:30px; list-style:none; padding:2px 16px; margin-top:1px;cursor: pointer;}
290 
.lishow li:hover{ background:#f0f0f0;}
282 291
283 292 
.historybox{ background: #FFFFFF; padding-bottom:20px;}
284 293 


@ -301,7 +310,28 @@ body{ color: #666666; font-size:14px;}
301 310 
.filterblock{padding:0; margin: 0; margin-top:2px ; background:#FFFFFF;overflow: hidden;}
302 311 
.filterblock li{list-style:none; float: left; border-right:1px solid #F0F0F0;}
303 312 
.filterblock li em{ font-size:18px; margin:0 2px;}
304 
.filterlist{ padding:0; margin: 0; border:none; border-radius:0;padding:6px 6px 6px 12px;font-size: 12px;}
313 
.filterlist{ padding:0; margin: 0; border:none; border-radius:0;padding:6px 6px 6px 12px;font-size: 13px;height: 32px;}
314 
/*筛选条件*/
315 
.popoverbox2 {border-radius:4px;width:0;height:0;width:100%;height:200px;font-size: 14px; }
316 
.popoverbox2 .mui-popover-arrow{left:50%; margin-left:-12px;}
317 
.popoverbox2 .mui-table-view{padding:4px;border-radius: 0; overflow: hidden;}
318 
.popoverbox2 .mui-table-view-cell{float:left;padding:8px 16px; width:40%; margin:2px 2%;border-radius:2px;}
319 
.popoverbox2 .mui-table-view-cell>a:not(.mui-btn){position: relative;}
320 
.popoverbox2 .mui-table-view-cell .mui-navigate-right:after { position:absolute;right: 0; color:#FF9900;font-size: 24px;}
321 
.popoverbox2 .mui-table-view .mui-table-view-cell:last-child,.popoverbox2 .mui-table-view .mui-table-view-cell:last-child>a:not(.mui-btn){border-radius:4px;}
322 
.popoverbox2 .mui-table-view .mui-table-view-cell:first-child,.popoverbox2 .mui-table-view .mui-table-view-cell:first-child>a:not(.mui-btn){border-radius:4px;}
323 
.popoverbox2 .mui-table-view .mui-table-view-cell{border-radius:4px; overflow: hidden; }
324 
.popoverbox2 .mui-table-view .mui-table-view-cell>a:not(.mui-btn).mui-active{background:#FF9900; color: #FFFFFF;}
325 
/*城市选择级联*/
326 
.menublock{ position: relative; }
327 
.menuposition{border-radius:4px; position: absolute; height:300px;width:100%; font-size: 14px;}
328 
.menuposition .mui-popover-arrow{left:50%; margin-left:-12px;}
329 
.menuposition.mui-table-view{border-radius: 0; overflow: auto;}
330 
.menuposition .mui-row.mui-fullscreen>[class*="mui-col-"] {height:100%;}
331 
.menuposition .mui-col-xs-4,.menuposition .mui-control-content {border-radius: 6px;overflow-y: auto;height: 100%;}
332 
.menuposition .mui-segmented-control .mui-control-item {line-height: 44px;width: 100%;}
333 
.menuposition .mui-segmented-control.mui-segmented-control-inverted.mui-segmented-control-vertical .mui-control-item, .mui-segmented-control.mui-segmented-control-inverted.mui-segmented-control-vertical .mui-control-item.mui-active {border-bottom: 1px solid #e8e8e8;}.menuposition .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {background-color: #FFFFFF;color:#FF9900;}
334
305 335 
/***********************搜索*******************/
306 336
307 337 
/*********************** 咨询*******************/

@ -333,7 +363,7 @@ body{ color: #666666; font-size:14px;}
333 363 
.filterblock2{padding:0; margin: 0; margin-top:2px ; background:#FFFFFF;overflow: hidden;}
334 364 
.filterblock2 li{list-style:none; position: relative; float: left; border-right:1px solid #F0F0F0;border-bottom:1px solid #F0F0F0;}
335 365 
.filterblock2 li select{  margin:0 2px;}
336 
.filterlist2{ padding:0; margin: 0; border:none; border-radius:0;padding:6px;font-size: 13px;}
366 
.filterlist2{ padding:0; margin: 0; border:none; border-radius:0;padding:6px;font-size: 13px;height: 32px;}
337 367
338 368 
.coutopicbox{ position: relative; background: #F0F0F0; margin-bottom: 10px; width:110%; margin-left:-16px; padding:4%; overflow: hidden;}
339 369 
.coutopicbox .coutheme{ max-width: 60%;}

@ -352,9 +382,11 @@ body{ color: #666666; font-size:14px;}
352 382 
.evabox span{ font-size: 12px;}
353 383 
.evabox .levelbox .mui-icon{ font-size: 14px; line-height: 14px; border:1px solid red;}
354 384 
/*咨询列表下拉菜单*/
355 
.popoverbox {border-radius: 6px;width:0;height:0;min-width: 90px;min-height:110px;font-size: 13px;}
356 
.popoverbox .mui-popover-arrow{top: -22px;width: 22px;height: 22px;}
357 
.popoverbox .mui-table-view-cell{padding:8px 14px;}
385 
.popoverbox {border-radius: 6px;width:0;height:0;min-width: 100px;min-height:110px;font-size: 13px; }
386 
.popoverbox .mui-popover-arrow{top: -22px;width: 22px;height: 22px; left:50%; margin-left:-12px;}
387 
.popoverbox .mui-table-view-cell{padding:8px 14px;/* text-align: center;*/}
388 
.popoverbox .mui-table-view-cell>a:not(.mui-btn){ margin-right:-12%;position: relative;}
389 
.popoverbox .mui-table-view-cell .mui-navigate-right:after { position:absolute;right: 0; color:#FF9900;font-size: 24px;}
358 390 
.mui-popover4{ width: 130px;  }
359 391 
/*********************** 咨询*******************/
360 392

+ 25 - 4
app/html/attentions.html
View File 

@ -20,8 +20,8 @@
20 20 
    	<!-- 主界面具体展示内容 -->
21 21 
		<div class="fixbox">
22 22 
			<ul class="fixbtn" id="fixbtn">
23 
				<li class="liactive">专家</li><!--当前选中状态    'liactive'-->
24 
				<li>资源</li>
23 
				<li index="0" class="liactive">专家</li><!--当前选中状态    'liactive'-->
24 
				<li index="1">资源</li>
25 25 
			</ul>
26 26 
		</div>
27 27 
		<div class="alllist">

@ -168,11 +168,32 @@
168 168 
		        </ul>
169 169 
			</div>
170 170 
		</div>
171 
		<a id="scrollToTop" class="backTop hide"> <span class="mui-icon mui-icon-arrowup"></span> </a>
171 
		<!--<a id="scrollToTop" class="backTop hide"> <span class="mui-icon mui-icon-arrowup"></span> </a>-->
172 172 
    </div>
173 173 
    <script src="../js/public/mui.min.js"></script>
174 174 
	<script type="text/javascript" charset="utf-8">
175 
		mui.init()
175 
		mui.init();
176 
		//------------------------------
177 
		//菜单tab切换
178 
		mui("#fixbtn").on("tap","li",function(){
179 
			var checkedindex=this.getAttribute("index");
180 
			var checkedcontent_arr=document.getElementsByClassName("childlist");
181 
			var libtn_arr = document.getElementById("fixbtn").getElementsByTagName("li");
182 
			mui.toast(checkedindex);
183 
			if(checkedindex==0){
184 
				libtn_arr[0].classList.add("liactive");
185 
				libtn_arr[1].classList.remove("liactive");
186 
				checkedcontent_arr[1].style.display = 'none';
187 
				checkedcontent_arr[0].style.display = 'block';
188 
			}else{
189 
				libtn_arr[1].classList.add("liactive");
190 
				libtn_arr[0].classList.remove("liactive");
191 
				checkedcontent_arr[0].style.display = 'none';
192 
				checkedcontent_arr[1].style.display = 'block';
193 
			}
194 
		})
195 
		//-----------------------------
196
176 197 
	</script>
177 198 
</body>
178 199 
</html>

+ 16 - 16
app/html/consultlist.html
View File 

@ -36,16 +36,16 @@
36 36 
    	<div class="filterbox2">
37 37 
			<ul class="filterblock2">
38 38 
				<li style="width:22%;">
39 
					<a href="#middlePopover1" class="mui-btn mui-btn-block mui-btn-outlined filterlist2">全部<em class="mui-icon mui-icon-arrowdown"></em></a>
39 
					<a href="#middlePopover1" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>全部</span><em class="mui-icon mui-icon-arrowdown"></em></a>
40 40 
				</li>
41 41 
				<li style="width:22%;">
42 
					<a href="#middlePopover2" class="mui-btn mui-btn-block mui-btn-outlined filterlist2">咨询方向<em class="mui-icon mui-icon-arrowdown"></em></a>
42 
					<a href="#middlePopover2" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>咨询方向</span><em class="mui-icon mui-icon-arrowdown"></em></a>
43 43 
				</li>
44 44 
				<li style="width:22%;">
45 
					<a href="#middlePopover3" class="mui-btn mui-btn-block mui-btn-outlined filterlist2">咨询状态<em class="mui-icon mui-icon-arrowdown"></em></a>
45 
					<a href="#middlePopover3" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>咨询状态</span><em class="mui-icon mui-icon-arrowdown"></em></a>
46 46 
				</li>
47 47 
				<li style="width:34%;">
48 
					<a href="#middlePopover4" class="mui-btn mui-btn-block mui-btn-outlined filterlist2" >按最后回复排序<em class="mui-icon mui-icon-arrowdown"></em></a>
48 
					<a href="#middlePopover4" class="mui-btn mui-btn-block mui-btn-outlined filterlist2" ><span>按最后回复排序</span><em class="mui-icon mui-icon-arrowdown"></em></a>
49 49 
				</li>
50 50 
			</ul>
51 51 
		</div>

@ -170,10 +170,10 @@
170 170 
			<div class="mui-popover-arrow"></div>
171 171 
			<div class="mui-scroll-wrapper">
172 172 
				<div class="mui-scroll">
173 
					<ul class="mui-table-view">
174 
						<li class="mui-table-view-cell"><a href="#">技术咨询</a></li>
175 
						<li class="mui-table-view-cell"><a href="#">资源咨询</a></li>
176 
						<li class="mui-table-view-cell"><a href="#">其它事务</a></li>
173 
					<ul class="mui-table-view mui-table-view-radio">
174 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">技术咨询</a></li>
175 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">资源咨询</a></li>
176 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">其它事务</a></li>
177 177 
					</ul>
178 178 
				</div>
179 179 
			</div>

@ -182,10 +182,10 @@
182 182 
			<div class="mui-popover-arrow"></div>
183 183 
			<div class="mui-scroll-wrapper">
184 184 
				<div class="mui-scroll">
185 
					<ul class="mui-table-view">
186 
						<li class="mui-table-view-cell"><a href="#">进行中</a></li>
187 
						<li class="mui-table-view-cell"><a href="#">待评价</a></li>
188 
						<li class="mui-table-view-cell"><a href="#">已完成</a></li>
185 
					<ul class="mui-table-view mui-table-view-radio">
186 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">进行中</a></li>
187 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">待评价</a></li>
188 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">已完成</a></li>
189 189 
					</ul>
190 190 
				</div>
191 191 
			</div>

@ -194,10 +194,10 @@
194 194 
			<div class="mui-popover-arrow"></div>
195 195 
			<div class="mui-scroll-wrapper">
196 196 
				<div class="mui-scroll">
197 
					<ul class="mui-table-view">
198 
						<li class="mui-table-view-cell"><a href="#">按最后回复排序</a></li>
199 
						<li class="mui-table-view-cell"><a href="#">按发起时间排序</a></li>
200 
						<li class="mui-table-view-cell"><a href="#">按完成时间排序</a></li>
197 
					<ul class="mui-table-view mui-table-view-radio">
198 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">按最后回复排序</a></li>
199 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">按发起时间排序</a></li>
200 
						<li class="mui-table-view-cell"><a class="mui-navigate-right" href="#">按完成时间排序</a></li>
201 201 
					</ul>
202 202 
				</div>
203 203 
			</div>

+ 5 - 5
app/html/proinforupdate.html
View File 

@ -70,14 +70,14 @@
70 70 
		    </div>
71 71 
		     <div class="mui-input-group mainbox">
72 72 
				<div class="maincon">
73 
			       <div class="infocontit">合作资源<a class="updatebox mui-clearfix" href=".html"><em class="updatebtn mui-pull-left"></em><span class="mui-pull-left">点击修改</span></a></div>
73 
			       <div class="infocontit">合作资源<a class="addinfobox mui-clearfix" style="right:1% ;" href="resinforupdate.html"><em class="addinfobtn mui-pull-left"></em><span class="mui-pull-left">点击添加</span></a></div>
74 74 
			       <div class="infocon">
75 75 
				       <ul class="mui-table-view resinfo">
76 76 
				            <li class="mui-table-view-cell mui-media">
77 
				                <a class="proinfor" href="resinforbrow.html">
77 
				                <a class="proinfor" href="resinforupdate.html">
78 78 
				                    <img class="mui-media-object mui-pull-left resimg" src="../images/default-resource.jpg">
79 79 
				                    <div class="mui-media-body">
80 
				                        <span class="listtit">资源名称</span>
80 
				                        <span class="listtit">资源名称<div class="updatebox" style="top:6px;right:6px;"><em class="updatebtn"></em></div></span>
81 81 
				                        <p class="listtit2">应用用途XXXXXXX</p>
82 82 
				                    	<p class="listtit3 resbrief">
83 83 
				                    		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan
 
@ -87,10 +87,10 @@
87 87 
				                </a>
88 88 
				            </li>
89 89 
				            <li class="mui-table-view-cell mui-media">
90 
				                <a class="proinfor" href="resinforbrow.html">
90 
				                <a class="proinfor" href="resinforupdate.html">
91 91 
				                    <img class="mui-media-object mui-pull-left resimg" src="../images/default-resource.jpg">
92 92 
				                    <div class="mui-media-body">
93 
				                        <span class="listtit">资源名称</span>
93 
				                        <span class="listtit">资源名称<div class="updatebox" style="top:8px;right:6px;"><em class="updatebtn"></em></div></span>
94 94 
				                        <p class="listtit2">应用用途XXXXXXX</p>
95 95 
				                    	<p class="listtit3 resbrief">
96 96 
				                    		Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan

+ 79 - 0
app/html/resinforupdate.html
View File 

@ -0,0 +1,79 @@
1 
<!doctype html>
2 
<html>
3 
	<head>
4 
		<meta charset="UTF-8">
5 
		<title></title>
6 
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
7 
		<link href="../css/mui.min.css" rel="stylesheet" />
8 
		<link href="../css/app.css" rel="stylesheet" />
9 
		<style>
10 
			body{background: #FFFFFF;}
11 
			.mui-content{ background: #FFFFFF;}
12 
		</style>
13 
	</head>
14
15 
	<body>
16 
		<header class="mui-bar mui-bar-nav toptitbox">
17 
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
18 
		    <h1 class="mui-title toptit">合作资源</h1>
19 
		    <span class="mui-pull-right topsave">保存</span>
20 
		</header>
21
22 
		<!-- 主页面内容容器 -->
23 
    	<div class="mui-content">
24 
    		<!-- 主界面具体展示内容 -->
25 
    		<div class="mui-input-group marginbox resoubox">
26 
    			<table>
27 
	            	<tr>
28 
	                	<td>
29 
	                		<div class="resouimgbox">
30 
								<img src="../images/default-resource.jpg"/>
31 
							</div>
32 
	                        <div class="resouinfoword">
33 
	                        	<div class="resouinfobox">
34 
									<div class="maincon" style="margin: 0;padding:0;">
35 
										<ul class="basicinfo" style="margin: 0;padding:0;">
36 
											<li><label>资源名称</label></li>
37 
											<li class="basicfrm"><input type="text" name="comname" class="mui-input-clear frmtype"></li>
38 
											<li><label>应用用途</label></li>
39 
											<li class="basicfrm">
40 
												<div class="textareabox" contenteditable="true"></div>
41 
											</li>
42 
											<li><label>学术领域</label></li>
43 
											<li class="basicfrm">
44 
												<div class="textareabox" contenteditable="true"></div>
45 
											</li>
46 
											<li><label>应用行业</label></li>
47 
											<li class="basicfrm">
48 
												<div class="textareabox" contenteditable="true"></div>
49 
											</li>
50 
											<li><label>详细描述</label></li>
51 
											<li class="basicfrm">
52 
												<div class="textareabox" contenteditable="true"></div>
53 
											</li>
54 
											<li><label>合作备注</label></li>
55 
											<li class="basicfrm">
56 
												<div class="textareabox" contenteditable="true"></div>
57 
											</li>
58 
										</ul>
59 
								        <div class="mui-input-group">
60 
											<button class="mui-btn mui-btn-block frmbtn exitbtn">删除此合作资源</button>
61 
									    </div>
62 
							        </div>
63 
								</div>
64 
	                         </div>
65 
	                     </td>
66 
	                 </tr>
67 
	           </table>
68 
		    </div>
69
70 
        </div>
71
72
73 
		<script src=" ../js/public/mui.min.js"></script>
74 
		<script type="text/javascript">
75 
			mui.init()
76 
		</script>
77 
	</body>
78
79 
</html>

+ 124 - 41
app/html/search-pro.html
View File 

@ -13,35 +13,34 @@
13 13 
	<!-- 主页面标题 -->
14 14 
    <header class="mui-bar mui-bar-nav toptitbox">
15 15 
    	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
16 
        <div class="searchbox2">
16 
        <div class="searchbox2 mui-pull-right">
17 17 
        	<div class="mui-pull-left searchselect">
18 
	        	<select class="mui-select">
19 
	        		<option>专家</option>
20 
	        		<option>资源</option>
21 
	        	</select>
18 
	        	<div class="simuselect">
19 
                	<div class="ulbox lookwho" id="div_select">专家</div>
20 
					<ul id="li_show" class="lishow">
21 
					    <li>专家</li>
22 
					    <li>资源</li>
23 
					</ul>
24 
				</div>
22 25 
	        	<em class="mui-icon mui-icon-arrowdown"></em>
23 26 
		    </div>
24 
		    <input type="text" class="mui-input-clear mui-pull-left searchtxt2" placeholder="搜索专家、设备资源">
27 
		    <input type="text" class="mui-input-clear mui-pull-right searchtxt2" placeholder="搜索专家、设备资源">
25 28 
        </div>
26 29 
	</header>
27 30
28 31 
    <!-- 主页面内容容器 -->
29 
    <div class="mui-content">
32 
    <div class="mui-content menublock">
30 33 
    	<!-- 主界面具体展示内容 -->
31 34 
		<div class="filterbox">
32 35 
			<ul class="filterblock">
33 
				<li>
34 
					<button id='showCityPicker' class="mui-btn mui-btn-block filterlist" type='button'>
35 
						<span id='cityResult' class="ui-alert">河北省</span>
36 
						<em class="mui-icon mui-icon-arrowdown"></em>
37 
					</button>
38
36 
				<li style="width:36%;">
37 
					<a href="#middlePopovercity" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>全国</span><em class="mui-icon mui-icon-arrowdown"></em></a>
39 38 
				</li>
40 
				<li>
41 
					<button class="mui-btn mui-btn-block filterlist" type='button'>学术领域<em class="mui-icon mui-icon-arrowdown"></em></button>
39 
				<li style="width:25%;">
40 
					<a href="#middlePopoveracad" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>学术领域</span><em class="mui-icon mui-icon-arrowdown"></em></a>
42 41 
				</li>
43 
				<li>
44 
					<button class="mui-btn mui-btn-block filterlist" type='button'>应用行业<em class="mui-icon mui-icon-arrowdown"></em></button>
42 
				<li style="width:25%;">
43 
					<a href="#middlePopoveruse" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>应用行业</span><em class="mui-icon mui-icon-arrowdown"></em></a>
45 44 
				</li>
46 45 
			</ul>
47 46 
		</div>

@ -138,35 +137,119 @@
138 137 
	            </li>
139 138 
	        </ul>
140 139 
		</div>
141 
		<a id="scrollToTop" class="backTop hide"> <span class="mui-icon mui-icon-arrowup"></span> </a>
140 
		<div class=" mui-row mui-popover mui-fullscreen menuposition" id="middlePopovercity">
141 
			<div class="mui-col-xs-4">
142 
				<div id="segmentedControls" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-vertical">
143 
				</div>
144 
			</div>
145 
			<div id="segmentedControlContents" class="mui-col-xs-8" style="border-left: 1px solid #d6d6d6; background-color: #FFFFFF;">
146 
				<div id="item1" class="mui-control-content mui-active">
147 
				</div>
148 
				<div id="item2" class="mui-control-content">
149 
				</div>
150 
				<div id="item3" class="mui-control-content">
151 
				</div>
152 
			</div>
153 
		</div>
154
155 
		<div id="middlePopoveracad" class="mui-popover popoverbox2">
156 
			<div class="mui-scroll-wrapper">
157 
				<div class="mui-scroll">
158 
					<ul class="mui-table-view">
159 
						<li class="mui-table-view-cell"><a class="mui-active" href="#">不限</a></li>
160 
						<li class="mui-table-view-cell"><a href="#">材料失效与保护</a></li>
161 
						<li class="mui-table-view-cell"><a href="#">材料表面与界面</a></li>
162 
						<li class="mui-table-view-cell"><a href="#">黑色金属及其合金</a></li>
163 
						<li class="mui-table-view-cell"><a href="#">金属材料</a></li>
164 
						<li class="mui-table-view-cell"><a href="#">有色金属及其合金</a></li>
165 
						<li class="mui-table-view-cell"><a href="#">材料检测与分析技术</a></li>
166 
						<li class="mui-table-view-cell"><a href="#">材料失效与保护</a></li>
167 
						<li class="mui-table-view-cell"><a href="#">材料表面与界面</a></li>
168 
						<li class="mui-table-view-cell"><a href="#">黑色金属及其合金</a></li>
169 
						<li class="mui-table-view-cell"><a href="#">金属材料</a></li>
170 
						<li class="mui-table-view-cell"><a href="#">有色金属及其合金</a></li>
171 
						<li class="mui-table-view-cell"><a href="#">材料检测与分析技术</a></li>
172 
					</ul>
173 
				</div>
174 
			</div>
175 
		</div>
176 
		<div id="middlePopoveruse" class="mui-popover popoverbox2">
177 
			<div class="mui-scroll-wrapper">
178 
				<div class="mui-scroll">
179 
					<ul class="mui-table-view">
180 
						<li class="mui-table-view-cell"><a class="mui-active" href="#">不限</a></li>
181 
						<li class="mui-table-view-cell"><a href="#">我的需求</a></li>
182 
						<li class="mui-table-view-cell"><a href="#">收到咨询</a></li>
183 
					</ul>
184 
				</div>
185 
			</div>
186 
		</div>
142 187
143 188 
    </div>
144 189 
    <script src="../js/public/mui.min.js"></script>
145 190 
    <script src="../js/public/mui.picker.min.js"></script>
146 
	<script src="../js/public/city.data.js" type="text/javascript" charset="utf-8"></script>
147 
	<script src="../js/public/city.data-3.js" type="text/javascript" charset="utf-8"></script>
148 191 
	<script type="text/javascript" charset="utf-8">
149 
		(function($, doc) {
150 
				$.init();
151 
				$.ready(function() {
152 
					//-----------------------------------------
153 
					//级联示例
154 
					var cityPicker = new $.PopPicker({
155 
						layer: 2
156 
					});
157 
					cityPicker.setData(cityData);
158 
					var showCityPickerButton = doc.getElementById('showCityPicker');
159 
					var cityResult = doc.getElementById('cityResult');
160 
					showCityPickerButton.addEventListener('tap', function(event) {
161 
						cityPicker.show(function(items) {
162 
							cityResult.innerText = items[0].text ;
163 
							//返回 false 可以阻止选择框的关闭
164 
							//return false;
165 
						});
166 
					}, false);
167 
					//-----------------------------------------
168 
				});
169 
			})(mui, document);
192 
			mui.init({
193 
				swipeBack: true //启用右滑关闭功能
194 
			});
195 
			//-------------------------------
196 
			//筛选添加弹出菜单
197 
			mui('.mui-scroll-wrapper').scroll();
198 
			mui('body').on('shown', '.mui-popover', function(e) {
199 
				//console.log('shown', e.detail.id);//detail为当前popover元素
200 
			});
201 
			mui('body').on('hidden', '.mui-popover', function(e) {
202 
				//console.log('hidden', e.detail.id);//detail为当前popover元素
203 
			});
204
205
206 
			//搜专家搜资源的下拉选择框
207 
			var showblock = document.getElementById("li_show");
208 
			var selectblock = document.getElementById("div_select");
209 
			selectblock.addEventListener('tap',function(){
210 
				showmenu();
211 
			});
212
213 
			mui("#li_show").on('tap','li',function(){
214 
				//liindex = this.getAttribute("index");
215 
				selectThis(this.innerHTML);
216 
			});
217
218 
			function selectThis(value){
219 
				selectblock.innerHTML=value;
220 
				showblock.style.display = 'none';
221 
				}
222
223 
			function showmenu(){
224 
			   showblock.style.display = 'block';
225 
			}
226
227 
        	//-----city--------------------------
228 
			var controls = document.getElementById("segmentedControls");
229 
			var contents = document.getElementById("segmentedControlContents");
230 
			var html = [];
231 
			var i = 1,
232 
				j = 1,
233 
				m = 16, //左侧选项卡数量+1
234 
				n = 21; //每个选项卡列表数量+1
235 
			for (; i < m; i++) {
236 
				html.push('<a class="mui-control-item" href="#content' + i + '">选项' + i + '</a>');
237 
			}
238 
			controls.innerHTML = html.join('');
239 
			html = [];
240 
			for (i = 1; i < m; i++) {
241 
				html.push('<div id="content' + i + '" class="mui-control-content"><ul class="mui-table-view">');
242 
				for (j = 1; j < n; j++) {
243 
					html.push('<li class="mui-table-view-cell">第' + i + '个选项卡子项-' + j + '</li>');
244 
				}
245 
				html.push('</ul></div>');
246 
			}
247 
			contents.innerHTML = html.join('');
248 
			 //默认选中第一个
249 
			controls.querySelector('.mui-control-item').classList.add('mui-active');
250 
			contents.querySelector('.mui-control-content').classList.add('mui-active');
251
252 
    </script>
170 253 
	</script>
171 254 
</body>
172 255 
</html>

+ 79 - 83
app/html/search-res.html
View File 

@ -14,15 +14,18 @@
14 14 
	<!-- 主页面标题 -->
15 15 
    <header class="mui-bar mui-bar-nav toptitbox">
16 16 
    	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left topback"></a>
17 
        <div class="searchbox2">
17 
        <div class="searchbox2 mui-pull-right">
18 18 
        	<div class="mui-pull-left searchselect">
19 
	        	<select class="mui-select">
20 
	        		<option>专家</option>
21 
	        		<option>资源</option>
22 
	        	</select>
19 
	        	<div class="simuselect">
20 
                	<div class="ulbox lookwho" id="div_select">专家</div>
21 
					<ul id="li_show" class="lishow">
22 
					    <li>专家</li>
23 
					    <li>资源</li>
24 
					</ul>
25 
				</div>
23 26 
	        	<em class="mui-icon mui-icon-arrowdown"></em>
24 27 
		    </div>
25 
		    <input type="text" class="mui-input-clear mui-pull-left searchtxt2" placeholder="搜索专家、设备资源">
28 
		    <input type="text" class="mui-input-clear mui-pull-right searchtxt2" placeholder="搜索专家、设备资源">
26 29 
        </div>
27 30 
	</header>
28 31 
	

@ -38,17 +41,11 @@
38 41 
					</button>
39 42
40 43 
				</li>
41 
				<li>
42 
					<button id='showAcadPicker' class="mui-btn mui-btn-block filterlist" type='button'>
43 
						<span id='acadResult' class="ui-alert">学术领域</span>
44 
						<em class="mui-icon mui-icon-arrowdown"></em>
45 
					</button>
44 
				<li style="width:25%;">
45 
					<a href="#middlePopoveracad" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>学术领域</span><em class="mui-icon mui-icon-arrowdown"></em></a>
46 46 
				</li>
47 
				<li>
48 
					<button class="mui-btn mui-btn-block filterlist" type='button'>
49 
						应用行业
50 
						<em class="mui-icon mui-icon-arrowdown"></em>
51 
					</button>
47 
				<li style="width:25%;">
48 
					<a href="#middlePopoveruse" class="mui-btn mui-btn-block mui-btn-outlined filterlist2"><span>应用行业</span><em class="mui-icon mui-icon-arrowdown"></em></a>
52 49 
				</li>
53 50 
			</ul>
54 51 
		</div>

@ -101,80 +98,79 @@
101 98 
	            </li>
102 99 
	        </ul>
103 100 
		</div>
104 
		<a id="scrollToTop" class="backTop hide"> <span class="mui-icon mui-icon-arrowup"></span> </a>
105 101
102 
		<div id="middlePopoveracad" class="mui-popover popoverbox2">
103 
			<div class="mui-popover-arrow"></div>
104 
			<div class="mui-scroll-wrapper">
105 
				<div class="mui-scroll">
106 
					<ul class="mui-table-view">
107 
						<li class="mui-table-view-cell"><a class="mui-active" href="#">不限</a></li>
108 
						<li class="mui-table-view-cell"><a href="#">我的需求</a></li>
109 
						<li class="mui-table-view-cell"><a href="#">收到咨询</a></li>
110 
						<li class="mui-table-view-cell"><a href="#">全部</a></li>
111 
						<li class="mui-table-view-cell"><a href="#">我的需求</a></li>
112 
						<li class="mui-table-view-cell"><a href="#">收到咨询</a></li>
113 
						<li class="mui-table-view-cell"><a href="#">全部</a></li>
114 
						<li class="mui-table-view-cell"><a href="#">我的需求</a></li>
115 
						<li class="mui-table-view-cell"><a href="#">收到咨询</a></li>
116 
						<li class="mui-table-view-cell"><a href="#">全部</a></li>
117 
						<li class="mui-table-view-cell"><a href="#">我的需求</a></li>
118 
						<li class="mui-table-view-cell"><a href="#">收到咨询</a></li>
119 
					</ul>
120 
				</div>
121 
			</div>
122 
		</div>
123 
		<div id="middlePopoveruse" class="mui-popover popoverbox2">
124 
			<div class="mui-popover-arrow"></div>
125 
			<div class="mui-scroll-wrapper">
126 
				<div class="mui-scroll">
127 
					<ul class="mui-table-view">
128 
						<li class="mui-table-view-cell"><a class="mui-active" href="#">不限</a></li>
129 
						<li class="mui-table-view-cell"><a href="#">我的需求</a></li>
130 
						<li class="mui-table-view-cell"><a href="#">收到咨询</a></li>
131 
					</ul>
132 
				</div>
133 
			</div>
134 
		</div>
106 135 
    </div>
107 136 
    <script src="../js/public/mui.min.js"></script>
108 137 
    <script src="../js/public/mui.picker.min.js"></script>
109 138 
	<script src="../js/public/city.data.js" type="text/javascript" charset="utf-8"></script>
110 139 
	<script src="../js/public/city.data-3.js" type="text/javascript" charset="utf-8"></script>
111 140 
	<script type="text/javascript" charset="utf-8">
112 
		(function($, doc) {
113 
				$.init();
114 
				$.ready(function() {
115 
					//-----------------------------------------
116 
					//级联示例
117 
					var cityPicker = new $.PopPicker({
118 
						layer: 2
119 
					});
120 
					cityPicker.setData(cityData);
121 
					var showCityPickerButton = doc.getElementById('showCityPicker');
122 
					var cityResult = doc.getElementById('cityResult');
123 
					showCityPickerButton.addEventListener('tap', function(event) {
124 
						cityPicker.show(function(items) {
125 
							cityResult.innerText = items[1].text ;
126 
							//返回 false 可以阻止选择框的关闭
127 
							//return false;
128 
						});
129 
					}, false);
130 
					//-----------------------------------------
131
132 
					//级联示例
133 
					var acadPicker = new $.PopPicker();
134 
					acadPicker.setData([{
135 
						value: 'ywj',
136 
						text: '1'
137 
					}, {
138 
						value: 'aaa',
139 
						text: '2'
140 
					}, {
141 
						value: 'lj',
142 
						text: '3'
143 
					}, {
144 
						value: 'ymt',
145 
						text: '4'
146 
					}, {
147 
						value: 'shq',
148 
						text: '5'
149 
					}, {
150 
						value: 'zhbh',
151 
						text: '6'
152 
					}, {
153 
						value: 'zhy',
154 
						text: '7'
155 
					}, {
156 
						value: 'gyf',
157 
						text: '8'
158 
					}, {
159 
						value: 'zhz',
160 
						text: '9'
161 
					}, {
162 
						value: 'gezh',
163 
						text: '10'
164 
					}]);
165 
					var showAcadPickerButton = doc.getElementById('showAcadPicker');
166 
					var acadResult = doc.getElementById('acadResult');
167 
					showAcadPickerButton.addEventListener('tap', function(event) {
168 
						acadPicker.show(function(items) {
169 
							acadResult.innerText = items[0].text;
170 
							//acadResult.innerText = JSON.stringify(items[0]);
171 
							//返回 false 可以阻止选择框的关闭
172 
							//return false;
173 
						});
174 
					}, false);
175 
					//-----------------------------------------
176 
				});
177 
			})(mui, document);
141 
		mui.init({
142 
			swipeBack: true //启用右滑关闭功能
143 
		});
144 
		//-------------------------------
145 
		//筛选添加弹出菜单
146 
		mui('.mui-scroll-wrapper').scroll();
147 
		mui('body').on('shown', '.mui-popover', function(e) {
148 
			//console.log('shown', e.detail.id);//detail为当前popover元素
149 
		});
150 
		mui('body').on('hidden', '.mui-popover', function(e) {
151 
			//console.log('hidden', e.detail.id);//detail为当前popover元素
152 
		});
153 
		//-------------------------------------------
154 
		//搜专家搜资源的下拉选择框
155 
		var showblock = document.getElementById("li_show");
156 
		var selectblock = document.getElementById("div_select");
157 
		selectblock.addEventListener('tap',function(){
158 
			showmenu();
159 
		});
160
161 
		mui("#li_show").on('tap','li',function(){
162 
			//liindex = this.getAttribute("index");
163 
			selectThis(this.innerHTML);
164 
		});
165
166 
		function selectThis(value){
167 
			selectblock.innerHTML=value;
168 
			showblock.style.display = 'none';
169 
			}
170
171 
		function showmenu(){
172 
		   showblock.style.display = 'block';
173 
		}
178 174 
	</script>
179 175 
</body>
180 176 
</html>