{extend name="adminblue/base" /}
{block name="resources"/}
<link rel="stylesheet" href="ADMIN_CSS/wxMenu/wx_base.css">
<link rel="stylesheet" href="ADMIN_CSS/wxMenu/wx_index.css">
<link rel="stylesheet" href="ADMIN_CSS/wxMenu/wx_tooltip.css">
<link rel="stylesheet" href="ADMIN_CSS/wxMenu/wx_lib.css" />
<link rel="stylesheet" href="ADMIN_CSS/wxMenu/wx_richvideo.css" />
<link rel="stylesheet" type="text/css" href="ADMIN_CSS/defau.css">
<style>
.menu_setting_area{margin:30px;}
.mobile_preview_closed {
    left: 122px;
}
input[type="text"]:focus{
	border:none!important
}
.input-common{
	border:none!important;
	height: 25px !important;
}
.menu_preview_area .pre_menu_item.current .pre_menu_link {
    border: 1px solid #126AE4;
    color: #126AE4;
}
.menu_preview_area .sub_pre_menu_list li.current a {
    color: #126AE4;
}
.menu_preview_area .sub_pre_menu_list li.current {
    border: 1px solid #126AE4;
}
</style>
<script src="ADMIN_JS/plugin/drag-arrange.js"></script>
<script src="ADMIN_JS/wx_menu/wx_menu.js?n=3"></script>
{/block}
{block name="main"}

{if condition="$menu_list_count == 0"}
<!-- 你尚未添加任何菜单 -->
<div class="menu_initial_box js_startMenuBox">
	<p class="tips_global">你尚未添加任何菜单</p>
	<a class="btn btn_primary btn_add js_openMenu" href="javascript:void(0);">
	<i class="icon14_common add_white"></i>添加菜单</a>
</div>
{else/}
<script>
	// 在关闭页面时弹出确认提示窗口
// 	$(window).bind('beforeunload', function() {
// 		 return '为确保内容不丢失，建议点击页面的绿色“保存并发布”按钮后再离开';
// 	});
</script>
{/if}
<!-- 菜单编辑 -->
<div class="menu_setting_area js_editBox" {if condition="$menu_list_count == 0"}style="display:none;"{/if}>
	<div class="menu_preview_area">
		<div class="mobile_menu_preview">
			<div class="mobile_hd tc">{$wx_name}</div>
			<div class="mobile_bd">
				<!-- 菜单 -->
				<ul class="pre_menu_list grid_line" id="menuList">
					{foreach name="menu_list" item="menu" key="k"}
					<!-- 加载菜单 -->
					<li class="pre_menu_item size1of{$class_index+1} {if condition='($k+1)==$menu_list_count'} current{/if}" data-menu-index="{$k+1}">
					
						<!-- 一级菜单 -->
						<a href="javascript:void(0);" ondragstart="return false" class="pre_menu_link jsMenu" data-menuid="{$menu.menu_id}" data-pid="0" data-menu-eventurl = "{$menu.menu_event_url}" data-menu-type = "{$menu.menu_event_type}" data-detault-menu-type = "{$menu.menu_event_type}" data-mediaid="{$menu.media_id}" data-sort="{$menu.sort}">
						
							{if condition = "$menu.child_count > 0"}
							<!-- 有二级菜单，显示小图标 -->
							<i class="icon_menu_dot js_icon_menu_dot dn"></i>
							{/if}
							<span>{$menu.menu_name}</span>
						</a>
						<!-- 一级菜单 -->
						
						<!-- 二级菜单 -->
						<div class="sub_pre_menu_box" data-submenulist="{$k+1}" {if condition="($k+1)!=$menu_list_count"}style="display: none;"{/if}>
							<ul class="sub_pre_menu_list">
							{foreach name="menu.child" item="sub_menu"}
								<li class="jsSubMenuInner">
									<a href="javascript:void(0);" ondragstart="return false" data-pid="{$sub_menu.pid}" data-menuid="{$sub_menu.menu_id}" data-menu-eventurl="{$sub_menu.menu_event_url}" data-menu-type = "{$sub_menu.menu_event_type}" data-detault-menu-type = "{$sub_menu.menu_event_type}" data-mediaid="{$sub_menu.media_id}" data-sort="{$sub_menu.sort}">
										<span class="sub_pre_menu_inner">{$sub_menu.menu_name}</span>
									</a>
								</li>
							{/foreach}
							
							<!-- 限制二级菜单数量的添加 -->
								<li class="jsSubMenu" data-pid="{$menu.menu_id}" data-subindex="{$k+1}" {if condition = "$menu.child_count == $MAX_SUB_MENU_LENGTH"}style="display:none;"{/if}>
									<a href="javascript:void(0);" title="最多添加{$MAX_SUB_MENU_LENGTH}个子菜单">
										<span class="sub_pre_menu_inner">
											<i class="icon14_menu_add" style="background-position: 0 0;"></i>
										</span>
									</a>
								</li>
							</ul>
							<i class="arrow arrow_out"></i> <i class="arrow arrow_in"></i><!-- 箭头 -->
						</div>
						<!-- 二级菜单 -->
						
					</li>
					{/foreach}
					
					<!-- 限制一级菜单数量的添加 -->
					<li class="js-addMenuBtn pre_menu_item size1of{$class_index+1}" {if condition = "$menu_list_count >= $MAX_MENU_LENGTH"}style="display:none;"{/if} data-class-index="{$class_index+1}">
						<a href="javascript:void(0);" class="pre_menu_link " title="最多添加{$MAX_MENU_LENGTH}个一级菜单">
							<i class="icon14_menu_add"></i>
							{if condition="$menu_list_count==0"}
							<span>添加菜单</span>
							{/if}
						</a>
					</li>
					
				</ul>
				<!-- 菜单 -->
			</div>
		</div>

		<!-- 菜单排序，后期实现拖拽 -->
		<div class="sort_btn_wrp" {if condition="$menu_list_count == 0"}style="display:none;"{/if}>
			<a id="orderBt" class="{if condition='$menu_list_count <2'} dn {/if}btn-common-white" href="javascript:void(0);">菜单排序</a>
			<span id="orderDis" class="{if condition='$menu_list_count >1'} dn {/if}btn-common-white btn_disabled">菜单排序</span>
			<a id="finishBt" href="javascript:void(0);" class="dn btn-common-white btn-big">完成</a>
		</div>

	</div>

	<div class="menu_form_area">
		<!-- 点击左侧菜单进行编辑操作 -->
		<div id="js_none" class="menu_initial_tips tips_global" style="display: none;">请通过拖拽左边的菜单进行排序</div>
		<div id="js_rightBox" class="portable_editor to_left">
			<div class="editor_inner">
				<div class="global_mod float_layout menu_form_hd js_second_title_bar">
					<h4 class="global_info">{$default_menu_info.menu_name}</h4>
					<div class="global_extra">
						<a href="javascript:void(0);" id="jsDelBt" data-menuid="{$default_menu_info.menu_id}" data-menuname="{$default_menu_info.menu_name}">删除菜单</a>
					</div>
				</div>
				<div class="menu_form_bd" id="view">
					<div id="js_innerNone"  class="msg_sender_tips tips_global"{if condition="$default_menu_info.child_count==0"}style="display: none;"{/if}>已添加子菜单，仅可设置菜单名称。</div>
					<div class="frm_control_group js_setNameBox">
						<label for="menuname" class="frm_label"><strong class="title js_menuTitle">菜单名称</strong></label>
						<div class="frm_controls">
							<span class="frm_input_box with_counter counter_in append">
								<input type="text" id="menuname"  data-switch="menuname" class="input-common" style="box-shadow: none; padding: 0;" value="{$default_menu_info.menu_name}">
							</span>
							<p class="frm_msg fail js_titleEorTips dn" style="display: none;">字节超过上限</p>
							<p class="frm_msg fail js_titlenoTips dn" style="display: none;">请输入菜单名称</p>
							<p class="frm_tips js_titleNolTips">字数不超过4个汉字或8个字母</p>
						</div>
					</div>
					<div class="frm_control_group js_setGraphic" {if condition="$default_menu_info.child_count>0"}style="display:none;"{/if}>
						<label for="" class="frm_label"> <strong class="title js_menuContent">菜单内容</strong></label>
						<div class="frm_controls frm_vertical_pt">
							<label class="frm_radio_label js_radio_sendMsg {if condition='$default_menu_info.menu_event_type == 2|| $default_menu_info.menu_event_type == 3'}selected{/if}">
								<i class="icon_radio"></i> <span class="lbl_content">发送消息</span>
							</label>
							<label class="frm_radio_label js_radio_url  {if condition='$default_menu_info.menu_event_type == 1'}selected{/if}">
								<i class="icon_radio"></i> <span class="lbl_content">跳转网页</span>
							</label>
						</div>
					</div>
					<div class="menu_content_container js_setGraphic" {if condition="$default_menu_info.child_count>0"}style="display:none;"{/if}>
						<!-- 发送消息 -->
						
						<div class="menu_content send jsMain" id="edit" {if condition='$default_menu_info.menu_event_type == 2|| $default_menu_info.menu_event_type == 3'} style="display: block;"{else/} style="display:none;"{/if}>
							<div class="msg_sender" id="editDiv">
								<div class="msg_tab">
									<div class="tab_navs_panel"> 
										<div class="tab_navs_wrp">
											<ul class="tab_navs js_tab_navs">

												<li class="tab_nav tab_appmsg width4 selected" data-type="10" data-tab=".js_appmsgArea" data-tooltip="图文消息">
													<a href="javascript:void(0);">&nbsp;<i class="icon_msg_sender"></i><span class="msg_tab_title">图文消息</span></a>
												</li>
												<!-- 
												<li class="tab_nav tab_img width4" data-type="2" data-tab=".js_imgArea" data-tooltip="图片">
													<a href="javascript:void(0);">&nbsp;<i class="icon_msg_sender"></i><span class="msg_tab_title">图片</span></a>
												</li>

												<li class="tab_nav tab_audio width4" data-type="3" data-tab=".js_audioArea" data-tooltip="语音">
													<a href="javascript:void(0);">&nbsp;<i class="icon_msg_sender"></i><span class="msg_tab_title">语音</span></a>
												</li>
												<li class="tab_nav tab_video width4 no_extra" data-type="15" data-tab=".js_videoArea" data-tooltip="视频">
													<a href="javascript:void(0);">&nbsp;<i class="icon_msg_sender"></i><span class="msg_tab_title">视频</span></a>
												</li> -->

											</ul>
										</div>
									</div>
									<div class="tab_panel">

										<div class="tab_content">
											<div class="js_appmsgArea inner">
											
												<div class="tab_cont_cover jsMsgSendTab" {if condition = "$default_menu_info.media_id != 0"}style="display:none;"{/if}>
													<div class="media_cover">
														<span class="create_access">
															<a class="add_gray_wrp jsMsgSenderPopBt" href="javascript:;">
															<i class="icon36_common add_gray"></i> <strong>从素材库中选择</strong>
														</a>
														</span>
													</div>
													<div class="media_cover">
														<span class="create_access">
															<a target="_blank" class="add_gray_wrp" href="{:__URL('ADMIN_MAIN/Wchat/addMedia')}">
																<i class="icon36_common add_gray"></i> <strong>新建图文消息</strong>
															</a>
														</span>
													</div>
												</div>
												
												<div id="show_media" {if condition = "$default_menu_info.media_id == 0"}style="display:none;"{/if}>
													<div class="appmsg multi has_first_cover">
														<div class="appmsg_content">
															<div class="appmsg_info">
																<em class="appmsg_date">
																	{$default_menu_info.media_list.create_time | getTimeStampTurnTime}
																</em>
															</div>
															<div class="cover_appmsg_item">
																<h4 class="appmsg_title js-media-title">
																	<a href="" target="_blank">
																		{$default_menu_info.media_list.title}
																	</a>
																</h4>
																
																<!-- 封面 -->
																<div class="appmsg_thumb_wrp"
																	{if condition = "$default_menu_info.media_list.item_list_count >0"}
																	style="background-image:url('{:__IMG($default_menu_info['media_list']['item_list'][0]['cover'])}')"
																	{/if}
																>
																</div>
																<a href="javascript:;" class="edit_mask preview_mask js-preview" data-media-item-id="{$default_menu_info['media_list']['item_list'][0]['id']}">
																	<div class="edit_mask_content">
																		<p style="color:#fff;">预览文章</p>
																	</div>
																	<span class="vm_box"></span>
																</a>
															</div>
															{if condition = "$default_menu_info.media_list.item_list_count >1"}
															{foreach name = "$default_menu_info.media_list.item_list" item="media" key="k"}
															{if condition="$k>0"}
															<!-- 从第二个开始循环 -->
															<div class="appmsg_item has_cover">
																<div class="appmsg_thumb_wrp" style="background-image:url('{:__IMG($media.cover)}');"></div>
																<h4 class="appmsg_title js_title"><a href="javascript:;" target="_blank">{$media.title}</a></h4>
																<a href="javascript:;" class="edit_mask preview_mask js-preview" data-media-item-id="{$media.id}">
																	<div class="edit_mask_content">
																		<p style="color:#fff;">预览文章</p>
																	</div>
																	<span class="vm_box"></span>
																</a>
															</div>
															{/if}
															{/foreach}
															{/if}
														</div>
													</div>
													<a href="javascript:;" class="jsmsgSenderDelBt link_dele" data-mediaid="{$default_menu_info.media_id}">删除</a>
												</div>

											</div>
										</div>
										<!-- 
										<div class="tab_content" style="display: none;">
											<div class="js_imgArea inner ">

												<div class="tab_cont_cover jsMsgSendTab" data-index="1" data-type="2">
													<div class="media_cover">
														<span class="create_access">
															<a class="add_gray_wrp jsMsgSenderPopBt" href="javascript:;" data-type="2" data-index="1">
																<i class="icon36_common add_gray"></i> <strong>从素材库中选择</strong>
															</a>
														</span>
													</div>
													<div class="media_cover">
														<span class="create_access">
															<a class="add_gray_wrp" id="msgSendImgUploadBt" data-type="2" href="javascript:;">
																<i class="icon36_common add_gray"></i> <strong>上传图片</strong>
															</a>
														</span>
													</div>
												</div>

											</div>
										</div>

										<div class="tab_content" style="display: none;">
											<div class="js_audioArea inner ">

												<div class="tab_cont_cover jsMsgSendTab" data-index="2" data-type="3">
													<div class="media_cover">
														<span class="create_access">
															<a class="add_gray_wrp jsMsgSenderPopBt" href="javascript:;" data-type="3" data-index="2">
																<i class="icon36_common add_gray"></i> <strong>从素材库中选择</strong>
															</a>
														</span>
													</div>
													<div class="media_cover">
														<span class="create_access">
															<a class="add_gray_wrp " id="msgSendAudioUploadBt" href="javascript:;">
																<i class="icon36_common add_gray"></i> <strong>新建语音</strong>
															</a>
														</span>
													</div>
												</div>

											</div>
										</div>

										<div class="tab_content" style="display: none;">
											<div class="js_videoArea inner ">

												<div class="tab_cont_cover jsMsgSendTab" data-index="3">
													<div class="media_cover">
														<span class="create_access">
															<a class="add_gray_wrp jsMsgSenderPopBt" href="javascript:;" data-type="15" data-index="3">
																<i class="icon36_common add_gray"></i> <strong>从素材库中选择</strong>
															</a>
														</span>
													</div>
													<div class="media_cover">
														<span class="create_access">
															<a target="_blank" class="add_gray_wrp" href="/cgi-bin/appmsg?t=media/videomsg_edit&amp;action=video_edit&amp;type=15&amp;lang=zh_CN&amp;token=65573610">
																<i class="icon36_common add_gray"></i> <strong>新建视频</strong>
															</a>
														</span>
													</div>
												</div>

											</div>
										</div> -->

									</div>
								</div>
							</div>
							<p class="profile_link_msg_global menu_send mini_tips warn dn js_warn">请勿添加其他公众号的主页链接</p>
						</div>
						
						<!-- 发送消息 -->
						
						<!-- 跳转网页 -->
						
						<div class="menu_content url jsMain" id="url"  {if condition='$default_menu_info.menu_event_type == 1'} style="display: block;"{else/} style="display:none;"{/if}>
							<!-- <form action="" id="urlForm" onsubmit="return false;"> -->
								<p class="menu_content_tips tips_global">订阅者点击该子菜单会跳到以下链接</p>
								<div class="frm_control_group">
									<label for="urltext" class="frm_label"><strong class="title">页面地址</strong></label>
									<div class="frm_controls">
										<span class="frm_input_box">
											<input type="text" class="frm_input" id="urltext" data-switch="url" value="{$default_menu_info.menu_event_url}" name="urlText" style="border: 0; box-shadow: none; padding: 0;">
										</span>
										<p class="profile_link_msg_global menu_url mini_tips warn dn js_warn">请勿添加其他公众号的主页链接</p>
										<!-- <p class="frm_tips" id="js_urlTitle" style="display: none;">
											来自<span class="js_name"></span><span style="display: none;">
												-《<span class="js_title"></span>》
											</span>
										</p> -->
									</div>
								</div>
								<!--
								<div class="frm_control_group btn_appmsg_wrap">
									<div class="frm_controls">
										<p class="frm_msg fail dn" id="urlUnSelect" style="display: none;">
											<span for="urlText" class="frm_msg_content" style="display: inline;">请选择一篇文章</span>
										</p>
										 <a href="javascript:;" id="js_appmsgPop">从公众号图文消息中选择</a> 
										<a href="javascript:void(0);" class="dn btn btn_default" id="js_reChangeAppmsg">重新选择</a>
									</div>
								</div>
								-->
							<!-- </form> -->
						</div>
						
						<!-- 跳转网页 -->
						
					<!-- 	<div class="menu_content sended" style="display: none;">
							<p class="menu_content_tips tips_global">订阅者点击该子菜单会跳到以下链接</p>
							<div class="msg_wrp" id="viewDiv"></div>
							<p class="frm_tips">
								来自<span class="js_name">素材库</span><span style="display: none;">
									-《<span class="js_title"></span>》
								</span>
							</p>
						</div> -->
						
						<div id="js_errTips" style="display: none;" class="msg_sender_msg mini_tips warn"></div>
					</div>
				</div>
			</div>
			
			<!-- 左箭头 -->
			
			<span class="editor_arrow_wrp">
				<i class="editor_arrow editor_arrow_out"></i>
				<i class="editor_arrow editor_arrow_in"></i>
			</span>
			
			<!-- 左箭头 -->
			
		</div>
		<!-- 点击左侧菜单进行编辑操作 -->

	</div>
</div>
<!-- 菜单编辑 -->

<div class="tool_bar tc js_editBtn" {if condition="$menu_list_count == 0"}style="visibility: hidden;"{/if}>
	<span id="pubBt" class="btn-common btn-big" style="display: inline-block;">保存并发布</span>
	<a href="javascript:void(0);" class="btn-common-white btn-big" id="viewBt" style="display: inline-block;">预览</a>
</div>

<!-- 删除菜单弹出框 -->
<div class="dialog_wrp ui-draggable" style="width: 720px; margin-left: -360px; margin-top: -186px; display: none;" id="wxDelDialog">
	<div class="dialog">
		<div class="dialog_hd">
			<h3>温馨提示</h3>
			<a href="javascript:;" class="pop_closed">关闭</a>
		</div>
		<div class="dialog_bd">
			<div class="page_msg large simple default">
				<div class="inner group">
					<span class="msg_icon_wrapper"><i class="icon_msg warn"></i></span>
					<div class="msg_content ">
						<h4>删除确认</h4>
						<p></p>
					</div>
				</div>
			</div>
		</div>
		<div class="dialog_ft">
			<a href="javascript:;" class="btn-common btn-big js_btn">确定</a>
			<a href="javascript:;" class="btn-common-white btn-big js_btn">取消</a>
		</div>
	</div>
</div>

<!-- 删除菜单弹出框 -->
<!-- 手机预览 -->
<div class="mobile_preview" id="mobileDiv" style="display: none;">
	<div class="mobile_preview_hd">
		<strong class="nickname">{$wx_name}</strong>
	</div>
	<div class="mobile_preview_bd">
		<ul id="viewShow" class="show_list"></ul>
	</div>
	<div class="mobile_preview_ft">
		<ul class="pre_menu_list grid_line" id="viewList">
			{foreach name="menu_list" item="menu" key="k"}
			<li class="pre_menu_item grid_item size1of{$menu_list_count}" data-mobile-menu-index="{$k+1}">
				<a href="javascript:void(0);" class="jsView pre_menu_link" title="{$menu.menu_name}" data-menuid="{$menu.menu_id}">
					{if condition = "$menu.child_count > 0"}
					<i class="icon_menu_dot"></i>
					{/if}
					<span>{$menu.menu_name}</span>
				</a>
				<div class="sub_pre_menu_box jsSubViewDiv" data-subIndex="{$k+1}" style="display: none">
					<ul class="sub_pre_menu_list">
						{foreach name="menu.child" item="sub_menu"}
						<li>
							<a href="javascript:void(0);" data-pid="{$sub_menu.pid}" data-menuid="{$sub_menu.menu_id}" class="jsSubView" title="{$sub_menu.menu_name}">{$sub_menu.menu_name}</a>
						</li>
						{/foreach}
					</ul>
					<i class="arrow arrow_out"></i><i class="arrow arrow_in"></i>
				</div>
			</li>
			{/foreach}
		</ul>
	</div>
	<a href="javascript:void(0);" class="mobile_preview_closed btn-common-white btn-big" id="viewClose">退出预览</a>
</div>
<!-- 遮罩层 -->
<div class="mask" style="display: none;" id="maskLayer"></div>
<!-- 操作反馈弹出框 erro 失败-->
<div class="JS_TIPS page_tips success" id="wxTips" style="display:none;">
	<div class="inner"></div>
</div>
<input type="hidden" id="hidden_default_sort" />
<input type="hidden" id="hidden_default_sub_sort" />
<!-- 选择图文素材 -->
{include file="adminblue/Wchat/controlWxDialog" /}
{/block}