开关
按钮类型有两类,一类是a标签的方式,一类是button的方式,目前我们按钮采用的是a标签方式
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text=""/>
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text="关"/>
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text="关" checked="checked"/>
<input type="checkbox" disabled="disabled" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text="关" checked="checked"/>
开关采用input[type="checkbox"]形式,默认是关,要设置默认打开许要添加属性checked="checked"
开关禁用需加上disabled='disabled'
单选
<div class="ui-grid-b users_select comp" comp="type:'radio',inputId:'receipt_select_value'">
<div class="ui-block-a margin_tb_10">
<div class="ipad_radio">
<span class="feedbackradio ico_pad_radio_checked30 margin_r_10" radio_value="1"></span>
<span class="ico32 attend_meeting_32 margin_r_10"></span>参加
</div>
</div>
<div class="ui-block-b margin_tb_10">
<div class="ipad_radio">
<span class="feedbackradio ico_pad_radio30 margin_r_10" radio_value="0"></span>
<span class="ico32 unattended_meeting_32 margin_r_10"></span>
不参加
</div>
</div>
<div class="ui-block-c margin_tb_10">
<div class="ipad_radio">
<span class="feedbackradio ico_pad_radio30 margin_r_10" radio_value="-1"></span>
<span class="ico32 unsure_32 margin_r_10"></span>
待定
</div>
</div>
<input type="hidden" value="1" id="receipt_select_value"/>
</div>
单选外层父级需要添加公共组件属性comp,inputId对应的值为单选所选取值的id
左侧页头
<div class="nav_list_banner">会议</div>
选项卡
<div data-role="tabs">
<div data-role="navbar">
<ul class="model_header_tabs">
<li><a href="#one" class="tab-ui-btn-a ui-btn-active" data-ajax="false">选项卡一</a></li>
<li><a href="#two" class="tab-ui-btn-a" data-ajax="false">选项卡二</a></li>
</ul>
</div>
<div id="one">
<h4>内容区域一</h4>
</div>
<div id="two">
<h4>内容区域二</h4>
</div>
</div>
<div data-role="tabs">
<div data-role="navbar" class="navbar_add_icon">
<ul>
<li>
<a href="#one1" class="tab-ui-btn-a ui-btn-active" data-ajax="false">
<span class="ico32 attend_meeting_32 margin_r_5"></span>参加
<span class="ico_pad_16 drop_up_btn_16 margin_l_25"></span>
</a>
</li>
<li>
<a href="#two2" class="tab-ui-btn-a" data-ajax="false">
<span class="ico32 accessory_32"></span>(<label>10</label>)
</a>
</li>
</ul>
</div>
<div id="one1">
<h4>内容区域三</h4>
</div>
<div id="two2">
<h4>内容区域四</h4>
</div>
</div>
附件
1、详情列表
-
500MB
-
500MB
-
500MB
-
500MB
2、上传附件
-
500MB
-
500MB
-
500MB
-
500MB
-
你好的斯蒂文四大看得见@#$#$#%离开大家#%E十年山三打谁奥斯卡符合阿速度撒旦法卡丽.DVD
500MB
<ul class="details_accessory padding_20 padding_b_0 clearFlow">
<li>
<div class="accessory_finish margin_5 margin_b_15">
<div class="padding_lr_10">
<span class="ico35 mp3_35 margin_t_10"></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<span class="ico_pad_28 cancel_upload_28 model_info_close"></span>
</div>
</li>
</ul>
<ul class="receipt_accessory_type clearFlow padding_t_30 padding_l_10 padding_r_10">
<li>
<div class="accessory_underway margin_lr_15 margin_tb_10">
<div class="accessory_underway_content">
<div class="padding_lr_10">
<span class="ico35 mp3_35 margin_t_10"></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年</label>
</p>
<p class="underway_accessory_size">500MB</p>
</div>
</div>
<p class="accessory_underway_bar"></p>
<span class="ico_pad_28 cancel_upload_28 model_info_close"></span>
</div>
</li>
<li>
<div class="accessory_finish margin_lr_15 margin_tb_10">
<div class="padding_lr_10">
<span class="ico35 mp3_35 margin_t_10"></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
你好的斯蒂文四大看得奥斯卡符合阿速度撒旦法卡丽.DVD
</p>
<p class="accessory_size">500MB</p>
</div>
<div class="accessory_download_icon padding_lr_10">
<span class="ico40 accessory_download_40"></span>
</div>
</div>
</li>
</ul>
详情附件每一行最多为3个
上传附件(弹出层上传)每一行最多为4个
页头
会议头部
<div class="content_header">
<div class="content_header_title">
<div>会议来了会议来了会议来了会议来了会议来了会议</div>
<div>
<span class="right ico14 accessory_14"></span>
</div>
</div>
<div class="clearFlow">
<span class="content_header_time">
<label>2013年11月15日</label><label>10:30-11:30</label>
</span>
<span class="content_header_name padding_r_10">胡小一</span>
</div>
</div>
会议内容
<div class="content">
<div>会议内容会议内容会议容会议内容会议内容。</div>
</div>
会议列表
<div class="content_list">
<div class="content_list">
<div>
会议时间:<label>17:00-17:30</label>
</div>
<div class="content_participants">
<a href="#meeting_user" data-rel="popup" data-position-to="#meeting_user_position" data-transition="pop">
<span class="content_participants_p">
与会人员:<label>胡小一、周小小、罗丽、王栋、图腾、小 午、田田、周读、陈凯、胡小一</label>
</span>
<span class="right ico_pad_28 spread_right_28 spread_right_position"></span>
<span class="right" id="meeting_user_position"></span>
</a>
</div>
<div>会议地点:<label>第一会议室105</label></div>
<div>主持人:<label>张小二</label></div>
<div>主持人:<label>张小二</label></div>
</div>
意见回复
1、回复意见
回复意见()
-
9-26 13:33
<div data-role="collapsible" data-collapsed="false" data-iconpos="right" data-inset="false"
class="content_reply margin_20 margin_b_0" >
<h4 class="content_reply_title">回复意见(<label>12</label>)</h4>
<ul>
<li class="margin_tb_20 margin_l_10 margin_r_10">
<div class="content_reply_content">
<div class="first_content_reply padding_b_5">
<div class="user_head">
<img src="../../../../skin/cmp/ipad/images/user1.png"/>
</div>
<div class="content_reply_info padding_l_10">
<p class="reply_person_info">
<label>赵康永</label>
<span class="start_time">
9-26 13:33
</span>
</p>
<p class="reply_type margin_t_15 margin_b_5">
<label>已阅</label>
<a href="#" class="ui-btn ui-btn-inline ui-btn-c">回复</a>
</p>
</div>
</div>
</div>
</li>
</ul>
</div>
2、震荡回复
回复意见()
-
9-26 13:33
非常好!全力保障客户问题,研发沟通达成一致。
发自客户端
<div data-role="collapsible" data-collapsed="false" data-iconpos="right" data-inset="false"
class="content_reply margin_20 margin_b_0" >
<h4 class="content_reply_title">回复意见(<label>12</label>)</h4>
<ul>
<li class="margin_tb_20 margin_l_10 margin_r_10">
<div class="content_reply_content">
<div class="first_content_reply padding_b_5">
<div class="user_head">
<img src="../../../../skin/cmp/ipad/images/user1.png"/>
</div>
<div class="content_reply_info padding_l_10">
<p class="reply_person_info">
<label>赵康永</label>
<span class="start_time">
9-26 13:33
</span>
</p>
<p class="reply_type margin_t_15 margin_b_5">
<label>已阅</label>
<a href="#" class="ui-btn ui-btn-inline ui-btn-c">回复</a>
</p>
<p class="reply_person_content padding_tb_15">
与研发沟通达成的一致,客服上报人做好提前预警。
</p>
<div>
<ul class="details_accessory padding_r_15 clearFlow">
<li>
<div class="accessory_finish margin_5 margin_b_15">
<div class="padding_lr_10">
<span class="ico35 mp3_35 margin_t_10"></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<div class="accessory_download_icon padding_lr_10">
<span class="ico40 accessory_download_40"></span>
</div>
</div>
</li>
</ul>
</div>
<p class="send_type padding_t_5">发自<label class="clientType">iphone</label>客户端</p>
</div>
</div>
<div class="user_reply_content margin_t_15 padding_lr_20">
<div class="user_reply_list user_reply_first_list">
<div class="user_head">
<img src="../../../../skin/cmp/ipad/images/user1.png" class="padding_t_20"/>
</div>
<div class="content_reply_info padding_t_20 padding_l_10">
<p class="reply_person_info">
<label>张大伟</label>
<span class="start_time">
9-26 13:33
</span>
</p>
<p class="reply_person_content padding_tb_15">
非常好!全力保障客户问题,研发沟通达成一致。
</p>
<p class="user_reply_type padding_b_15">发自<label class="clientType">Android</label>客户端</p>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>