SOURCE

console 命令行工具 X clear

                    
>
console
/*点击元素以外任意地方隐藏该元素*/
$(document).click(function(e){
    var target = $(e.target);
    if(target.closest(".editControl").length != 0) return;
    $(".editControl").hide();
})


$(function(){
    //off 先取消绑定,否则会调用多次
    $('.icon_ApprovalItemClose').off('click').on('click',deleteitem);
    /*模板*/
    $("body").delegate("#noAdd","click",function(event){
        event.stopPropagation();
        $(".editControl").show();
        $(".widget_dialog").css({
            top:"218px",
            left:"232px"
        })
    })
    $("body").delegate("#yesAdd","click",function(event){
        event.stopPropagation();
        $(".editControl").show();
        $(".widget_dialog").css({
            top:"288px",
            left:"88px"
        })
    })

    /* 点击其他控件*/
    $('.dialog_item').off('click').on('click', function () {
        var that = $(this);
        appendTemplate(that);
    })
    /* 点击“发票”控件
       *1.如果列表中没有发票,则点击只能添加一次
       *2.如果有发票列表,则不能再添加
    */
    $('.notetemplate').on('click', function () {
        var that = $(this);
        appendTemplate(that);
    })
    $('.achievetemplate').on('click', function () {
        var that = $(this);
        appendTemplate(that);
    })
    $('.meetingtemplate').on('click', function () {
        var that = $(this);
        appendTemplate(that);
    })


    function appendTemplate(that){
        var type = that.data('type');

        var title = that.data('title');

        $('.Edit_scroll').append('<li class="Edit-element"> ' + $('.Edit_scroll_content>.' + title).html() + '</li>');

        //获取控件库中的标题
        var panel_title= $(that).children(".dialog_item_text").text();
        $(".Edit_scroll li").last().find(".panel_title").html(panel_title);
        $(".Edit_scroll li").last().find(".approvalEdit_panel").attr("data-title",panel_title);
        $(".Edit_scroll li").last().find(".type").attr("data-type",type);
        //随机添加入
        $(".Edit_scroll").sortable('disable');

        //控件库 + 添加控件的显示
        $('.editControl').hide();
        $('.approvalEdit_empty').hide();
        $('.approvalEdit_addWidget').show();

        //共用部分
        allitem(type,panel_title, "");

        //给当前添加的li加入样式
        $(".Edit_scroll li").last().find(".line").addClass("Selected");
        $(".Edit_scroll li").last().find(".icon_ApprovalItemClose").show();
        //如果是check 类型的, 默认要将选项值放入隐藏域里面
        addSelect(type);
        //off 先取消绑定,否则会调用多次
        $('.icon_ApprovalItemClose').off('click').on('click',deleteitem);

        //控件说明


    }
    //点击当前文本框时,切换
    $("body").delegate(".Edit_scroll .Edit-element","click",function(){
        var that = $(this);
        var type = that.find('.approvalEdit_panel').data('type');
        var panel_title = $(that).find('.panel_title').text().replace("*", '');
        var placehold = $(that).find('.panel_title').next().text().trim();
        allitem(type,panel_title, placehold);

        //当前点击文本的时候, 对应必填选项
        if($(that).find('.panel_title').html().indexOf("*") > -1){
            //选中
            $(".js_validate").attr("checked" , "checked");
        }else{
            //没有选中
            $(".js_validate").removeAttr("checked");
        }

        $(that).find(".line").addClass("Selected");
        $(that).find(".icon_ApprovalItemClose").show();
        $(".editItem_checkboxItemWrap").empty();
        //如果点击, 查看类型是不是checkbox, radio , 如果是, 需要回显示
        if(type == "select" || type == "checkbox"){
            var selectVal = $(that).find(".Selected").find("div").html();
            var arrVal = selectVal.split(",");
            //循环把数据放出来
            var htmlStr = '';
            for(var i=0; i<arrVal.length; i++){
                htmlStr = selectHtml(arrVal[i])
                $(".editItem_checkboxItemWrap").append(htmlStr);
            }
        }
    })


    //共用
    function allitem(type,panel_title, panel_placeholder) {

        $('.line').removeClass('Selected');
        $('.icon_ApprovalItemClose').hide();


        $('.item_edit').show();
        $(".checkbox").hide();

        //选择控件时,改变的标题
//        $('.item_edit').find(".item").html(panel_title);
        $('.item_edit').find(".input1").val(panel_title);
        $(".item_edit").find(".qui_textarea").val(panel_placeholder);
        $(".item_edit").find(".qui_textarea").attr("placeholder", "请输入");

        $(".editWidget_wrap:last-child .Edit_editItem:first-child").show();
        $(".explain").show();
        //这里得判断类型
        //选择文本框时,改变的标题

        if(type == "select" || type == "checkbox"){
            $(".checkbox").show();
        }
        if(type == "tips" || type == "file"|| type == "note" || type == "achieve" || type == "meeting"){
            $(".explain").hide();
        }
        if(type == "note"){
            $(".notetemplate").unbind();
            $(".notetemplate").children(".ww_icon_ApprovalNote").addClass("noteUnbind");
            $(".notetemplate").children(".dialog_item_text").css("color","#cccc");
        }
        if(type == "achieve"){
            $(".achievetemplate").unbind();
            $(".achievetemplate").children(".ww_icon_Approvalachieve").addClass("achieveUnbind");
            $(".achievetemplate").children(".dialog_item_text").css("color","#cccc");


        }
        if(type == "meeting"){
            $(".meetingtemplate").unbind();
            $(".meetingtemplate").children(".ww_icon_Approvalmeeting").addClass("meetingUnbind");
            $(".meetingtemplate").children(".dialog_item_text").css("color","#cccc");
        }
    }
    //删除
    function deleteitem() {
        var that = $(this);
        var parent = that.parent();
        parent.remove();
        $('.item_edit').hide();
        if($('.Edit_scroll li').length==0){
            $('.approvalEdit_empty').show();
//                $('.approvalEdit_addWidget').hide();
            $('.item_edit').hide();
        }

        /*删除的是“发票”列表时,重新绑定点击事件*/
        var title= parent.children(".approvalEdit_panel").data("title");
        if(title == "发票"){
            $(".notetemplate").children(".ww_icon_ApprovalNote").removeClass("noteUnbind");
            $(".notetemplate").children(".dialog_item_text").css("color","#4A5159");
            $('.notetemplate').on('click', function () {
                var that = $(this);
                appendTemplate(that);
            })
        }
        /*删除的是“成果模板”列表时,重新绑定点击事件*/
        if(title == "成果模板"){
            $(".achievetemplate").children(".ww_icon_Approvalachieve").removeClass("achieveUnbind");
            $(".achievetemplate").children(".dialog_item_text").css("color","#4A5159");
            $('.achievetemplate').on('click', function () {
                var that = $(this);
                appendTemplate(that);
            })

        }
        /*删除的是“会议模板”列表时,重新绑定点击事件*/
        if(title == "会议模板"){
            $(".meetingtemplate").children(".ww_icon_Approvalmeeting").removeClass("meetingUnbind");
            $(".meetingtemplate").children(".dialog_item_text").css("color","#4A5159");
            $('.meetingtemplate').on('click', function () {
                var that = $(this);
                appendTemplate(that);
            })
        }
    }


    function addSelect(type){
        if(type != "select" && type != "checkbox") return;
        $(".editItem_checkboxItemWrap").html('');

        $(".editItem_checkboxItemWrap").append(selectHtml("选项1"));
        $(".editItem_checkboxItemWrap").append(selectHtml("选项2"));
        $(".Selected").children("div").html("选项1,选项2");
    }


    //动态绑定
    function selectHtml(name){
        var htmlStr = '<div content="'+name+'" class="editItem_selectItem">' +
            '<div class="editItem_select">' +
            '<input type="text" class="qui_inputText ww_inputText ww_inputText_Big editItem_input" value="'+name+'" placeholder="选项名称" maxlength="28" onblur="blurInput();">' +
            ' <span class="ww_icon icon_ApprovalItemDel editItem_icon select-delete" onclick="radioRemoveBtn(this);"></span>' +
            '<span class="ww_icon icon_ApprovalItemAdd editItem_icon select-add" onclick="radioAddBtn(this);"></span>' +
            '<div class="inputWithTips_tips"></div>' +
            '</div>'
        '</div>';
        return htmlStr;
    }

})


var requiredHtml = '<span class="red">*</span>';

$(function(){
	
	/**监控输入名称*/
	$("#temp_name").bind('blur', function(event) {
		var keycode = (event.keyCode ? event.keyCode : event.which);
		var temp_name = $("#temp_name").val();
		var default_name = "未命名模板";
		if(temp_name.length == 0){
			$("#top_title").html(default_name);
			$("#temp_name").val(default_name);
		}else if(temp_name.length <= 28){
			$("#top_title").html($("#temp_name").val());			
		}
	});
	
	
	/**右侧详情点击时候, 绑定同一个时间*/
	$(".input1, .ww_textarea").bind('blur', function(event){
		console.log("----blur------这个传值处修改-----------");
		var textval = $(this).val();
		if(textval.length == 0){
			//没有输入时候,默认会原来的数据
			textval = curClick().attr("data-title");
			if($(this).hasClass("ww_inputText")){
//				$(this).next().html("请输入文本名称");
				$(this).val(textval);
			}else{
				$(this).attr("placeholder", "请输入")	;
				textval = $(this).attr("placeholder");
			}
		}
		
		
		if($(this).hasClass("ww_inputText")){
			//文本名称
			detailHtml(textval, "input");
		}else if($(this).hasClass("ww_textarea")){
			//填写名称
			detailHtml(textval, "text");
		}
	});
	
	/**必填选项*/
	$(".ww_checkbox").click(function(){
		/**判断是否选中, 如果选中, 对应的控件就增加文本, 如果没有选中, 就删除文本*/
		var html = $(".Selected").children(":first").html();
		if($(this).is(':checked')){
			//选中
			if(html.indexOf(requiredHtml) == -1){
				html += requiredHtml;				
			}
		}else{
			//未选中, 移除span的自选项
			html = html.replace(requiredHtml, '');
		}
		$(".Selected").children(":first").html(html);
	});
	
	
	
	
	
});

/**失去焦点绑定*/
function blurInput(){
	var node = curClick();//获取当前选择的模块
	getSelectVal(node);//开始赋值
}

/**获取左侧选中的对象*/
function curClick(){
	
	var obj = $(".Selected").parent();
	return obj;
}

/**判断是否有校验*/
function hasCheck(obj){
	
	if(obj == undefined){ return false;}
	else if(obj.get(0) == null || obj.get(0) == undefined){
		return false;
	}else{
		return true;
	}
}


/**右侧点击时候处理*/
function detailHtml(val, tag){
	/**获取选中的对象*/
	var curObj = curClick();
	var tagVal = curObj.attr("data-title");
	var obj = curObj.find(".Selected");
	if(tag == 'input'){
		var validateFlag = hasCheck(obj.find("label").children()); //判断底下有没有
		if(validateFlag){
			val = val + requiredHtml;
		}
	}
	if(tagVal == '文本' || tagVal == "数字" || tagVal == "日期" || tagVal == "日期+时间" || tagVal == "金额"){
		//文本
		if(tag == 'input'){
			obj.find("label").html(val);				
		}else{
			obj.children("span").html(val);
		}
	}else if(tagVal == '多行文本' || tagVal == '说明文字'){
		//多行文本
		if(tag == 'input'){
			obj.find("label").html(val);					
		}else{
			obj.find(".panel_textarea").html(val);
		}
	}else if(tagVal == '附件'){
		//附件
		if(tag == 'input'){
			obj.find("label").html(val);					
		}
	}else if(tagVal == '明细'){
		//明细
		if(tag == 'input'){
			obj.find(".panel_list_title").html(val);					
		}
	} else if(tagVal == "单选框"){
		//单选框
		if(tag == 'input'){
			obj.find("label").html(val);					
		}else{
			obj.find(".panel_input").html(val);
		}
	}else if(tagVal == "多选框"){
		//多选框
		if(tag == 'input'){
			obj.find("label").html(val);					
		}else{
			obj.find(".panel_input").html(val);
		}
	}
}

/**
 * 单选按钮的 移除事件
 * @param node
 * @returns
 */
function radioRemoveBtn(node){
	$(node).parents(".editItem_selectItem").hide();
	blurInput();
}

/**
 * 单选按钮的 添加事件
 * @param node
 * @returns
 */
function radioAddBtn(node){
	var i = $(".editItem_content").children().length;
	var html = '<div content="选项'+i+'" class="editItem_selectItem"> ' + 
	        	   '<div class="editItem_select"> ' +
		        	   '<input type="text" class="qui_inputText ww_inputText ww_inputText_Big editItem_input" value="选项'+i+'" placeholder="选项名称" maxlength="28" onblur="blurInput();"> ' + 
		        	   '<span class="ww_icon icon_ApprovalItemDel editItem_icon select-delete" onclick="radioRemoveBtn(this);"></span> ' +
		        	   '<span class="ww_icon icon_ApprovalItemAdd editItem_icon select-add" onclick="radioAddBtn(this);"></span>' + 
		        	   '<div class="inputWithTips_tips"></div>' + 
	        	   '</div>' + 
        	   '</div>';
	
	$(".editItem_checkboxItemWrap").append(html);
	blurInput();
}


/**
 * 鼠标失去焦点之后,开始赋值
 * */
function getSelectVal(node){
	//鼠标失去焦点 , 获取当前对象下有多少个值, 就开始拼接
	var val = '';
	$(".editItem_checkboxItemWrap").children(".editItem_selectItem").each(function(){
		if(!$(this).is(":hidden")){
			val += $(this).find("input").val()+",";			
		}
	});
	if(!checkNull(val)){
		val = val.substring(0, val.length - 1);
	}
	$(node).children("div").find("div").html(val);
}
//非空校验 by TigerHu
function checkNull(val){
    if (val == null || "" === val) return true;
    return false;
}





<div class="main" id="topContanier" style="min-width:1100px;">
  <div class="wrapper">
    <div class="container fadeInUp">
      <input type="hidden" id="maxSort" value="90" />
      <div class="layout clearfix">
        <div class="crumbLink1 clearfix">
          <!-- 数据列表 -->
          <div class="r-date-box m-t-10">
            <div class="template">
              <div class="template_cont">
                <div class="customTemplate">
                  <!-- 手机模板-->
                  <div class="Edit">
                    <div class="Edit_content">
                      <div class="Edit_content_p">
                        <span class="Edit_content_title">
                          未命名模板
                        </span>
                      </div>
                      <div class="Edit_scroll">
                        <li>
                          <div class="approvalEdit_panel type" data-title="用户">
                            <div class="panel_wrap">
                              <label class="panel_title">
                                用户
                                <span class="red">
                                  *
                                </span>
                              </label>
                              <span class="panel_input">
                                请输入
                              </span>
                            </div>
                          </div>
                        </li>
                        <li>
                          <div class="approvalEdit_panel type" data-title="手机号">
                            <div class="panel_wrap">
                              <label class="panel_title">
                                手机号
                                <span class="red">
                                  *
                                </span>
                              </label>
                              <span class="panel_input">
                                请输入
                              </span>
                            </div>
                          </div>
                        </li>
                      </div>
                      <div class="Edit_scroll_content" style="display: none;">
                        <!-- 文本 + 数字 + 日期 + 日期时间 + 金额共用模板-->
                        <li class="Edit-element text">
                          <div class="approvalEdit_panel type" data-title="文本">
                            <div class="panel_wrap line">
                              <label class="panel_title">
                                文本
                              </label>
                              <span class="panel_input">
                                请输入
                              </span>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 多行文本模板-->
                        <li class="Edit-element textarea">
                          <div class="approvalEdit_panel type" data-title="多行文本">
                            <div class="panel_wrap HasContent line">
                              <label class="panel_title">
                                多行文本
                              </label>
                              <div class="panel_content">
                                <div class="panel_textarea">
                                  请输入
                                </div>
                              </div>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 附件模板-->
                        <li class="Edit-element file">
                          <div class="approvalEdit_panel type" data-title="附件">
                            <div class="panel_wrap HasContent line">
                              <label class="panel_title">
                                附件
                              </label>
                              <div class="panel_content">
                                <span class="panel_textarea">
                                </span>
                                <div class="approvaledit_panel_image">
                                  <span class="icon_AddFileBtnPreview">
                                  </span>
                                </div>
                              </div>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 单选 + 多选共用模板-->
                        <li class="Edit-element select">
                          <div class="approvalEdit_panel type" data-title="单选" data-type="select">
                            <div class="panel_wrap line">
                              <label class="panel_title">
                                单选
                              </label>
                              <span class="panel_input">
                                请选择
                              </span>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 说明文字模板-->
                        <li class="Edit-element tips">
                          <div class="approvalEdit_panel_tips type" data-title="说明">
                            <div class="panel_wrap line">
                              <span class="approvaledit_tips_value panel_title">
                                请输入说明文字
                              </span>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 发票模板-->
                        <li class="Edit-element note">
                          <div class="approvalEdit_panel type">
                            <div class="line">
                              <div class="approvalEdit_panel_list_title panel_title">
                                发票
                              </div>
                              <div class="approvalEdit_panel" data-title="付款单位名称">
                                <div class="panel_wrap">
                                  <label class="">
                                    付款单位名称
                                  </label>
                                  <span class="panel_input">
                                    请输入
                                  </span>
                                </div>
                              </div>
                              <div class="approvalEdit_panel" data-title="付款单位纳税人识别号">
                                <div class="panel_wrap">
                                  <label class="">
                                    付款单位纳税人识别号
                                  </label>
                                  <span class="panel_input">
                                    请输入
                                  </span>
                                </div>
                              </div>
                              <div class="approvalEdit_panel" data-title="付款单位地址">
                                <div class="panel_wrap">
                                  <label class="">
                                    付款单位地址
                                  </label>
                                  <span class="panel_input">
                                    请选择
                                  </span>
                                </div>
                              </div>
                              <div class="approvalEdit_panel" data-title="详细地址">
                                <div class="panel_wrap">
                                  <label class="">
                                    详细地址
                                  </label>
                                  <span class="panel_input">
                                    请输入
                                  </span>
                                </div>
                              </div>
                              <div class="approvalEdit_panel" data-title="电话">
                                <div class="panel_wrap">
                                  <label class="">
                                    电话
                                  </label>
                                  <span class="panel_input">
                                    请输入
                                  </span>
                                </div>
                              </div>
                              <div class="approvalEdit_panel" data-title="付款单位开户银行">
                                <div class="panel_wrap">
                                  <label class="">
                                    付款单位开户银行
                                  </label>
                                  <span class="panel_input">
                                    请输入
                                  </span>
                                </div>
                              </div>
                              <div class="approvalEdit_panel" data-title="账号">
                                <div class="panel_wrap">
                                  <label class="">
                                    账号
                                  </label>
                                  <span class="panel_input">
                                    请输入
                                  </span>
                                </div>
                              </div>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 成果模板-->
                        <li class="Edit-element achieve">
                          <div class="approvalEdit_panel type">
                            <div class="line">
                              <div class="approvalEdit_panel_list_title panel_title">
                                成果
                              </div>
                              <div class="achieve-table">
                                <div class="achieve-table-index">
                                  <div class="approvalEdit_panel" data-title="序号">
                                    <div class="panel_wrap">
                                      <label class="">
                                        序号
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="approvalEdit_panel" data-title="人员姓名">
                                    <div class="panel_wrap">
                                      <label class="">
                                        人员姓名
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="approvalEdit_panel" data-title="职务/职称">
                                    <div class="panel_wrap">
                                      <label class="">
                                        职务/职称
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="approvalEdit_panel" data-title="联系电话">
                                    <div class="panel_wrap">
                                      <label class="">
                                        联系电话
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="approvalEdit_panel" data-title="收件人电话">
                                    <div class="panel_wrap">
                                      <label class="">
                                        收件人电话
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="table-option">
                                    <span class="optionAddBtn">
                                      新增
                                    </span>
                                    <span class="optionDelBtn">
                                      删除
                                    </span>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                        <!-- 会议模板-->
                        <li class="Edit-element meeting">
                          <div class="approvalEdit_panel type">
                            <div class="line">
                              <div class="approvalEdit_panel_list_title panel_title">
                                会议
                              </div>
                              <div class="meeting-table">
                                <div class="meeting-table-index">
                                  <div class="approvalEdit_panel" data-title="姓名">
                                    <div class="panel_wrap">
                                      <label class="">
                                        姓名
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="approvalEdit_panel" data-title="职务">
                                    <div class="panel_wrap">
                                      <label class="">
                                        职务
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="approvalEdit_panel" data-title="手机">
                                    <div class="panel_wrap">
                                      <label class="">
                                        手机
                                      </label>
                                      <span class="panel_input">
                                        请输入
                                      </span>
                                    </div>
                                  </div>
                                  <div class="table-option">
                                    <span class="optionAddBtn">
                                      新增
                                    </span>
                                    <span class="optionDelBtn">
                                      删除
                                    </span>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                          <span class="panel_close icon_ApprovalItemClose">
                          </span>
                        </li>
                      </div>
                      <!-- 已添加控件出现-->
                      <div class="approvalEdit_addWidget js_addWidget edit" id="yesAdd">
                        <i class="approvalEdit_add_icon">
                        </i>
                        添加控件
                      </div>
                    </div>
                  </div>
                  <!-- 控件右边详情-->
                  <div class="template_edit">
                    <div class="editWidget_wrap">
                      <div class="Edit_editItem">
                        <div class="editItem_title">
                          模板名称
                        </div>
                        <div class="editItem_content">
                          <input type="text" class="qui_inputText ww_inputText ww_inputText_Big js_template_name"
                          placeholder="请输入" value="未命名模板">
                          <div class="ww_inputWithTips_tips" style="display: none;">
                            请输入模板名称
                          </div>
                        </div>
                      </div>
                    </div>
                    <!-- 选择控件后出现的详情-->
                    <div class="item_edit" style="display: none;">
                      <li class="draggable-element">
                        <div class="editWidget_wrap">
                          <div class="Edit_editItem">
                            <div class="editItem_title">
                              控件类型
                            </div>
                            <div class="editItem_content item">
                              文本
                            </div>
                          </div>
                          <div class="Edit_editItem">
                            <div class="editItem_title">
                              控件名称
                            </div>
                            <div class="editItem_content">
                              <input type="text" class="input1 qui_inputText ww_inputText ww_inputText_Big js_title"
                              placeholder="请输入" value="文本">
                              <div class="ww_inputWithTips_tips">
                              </div>
                            </div>
                          </div>
                          <div class="Edit_editItem explain">
                            <div class="editItem_title">
                              控件说明
                            </div>
                            <div class="editItem_content">
                              <textarea name="" class="qui_textarea ww_textarea js_placeholder" placeholder="请输入">
                              </textarea>
                              <div class="ww_inputWithTips_tips">
                              </div>
                            </div>
                          </div>
                          <div class="Edit_editItem checkbox" style="display: none;">
                            <div class="editItem_title">
                              添加选项
                            </div>
                            <div class="editItem_content editItem_checkboxItemWrap">
                              <div content="选项1" class="editItem_selectItem">
                                <div class="editItem_select">
                                  <input type="text" class="qui_inputText ww_inputText ww_inputText_Big editItem_input"
                                  value="选项1" placeholder="选项名称">
                                  <span class="ww_icon icon_ApprovalItemDel editItem_icon select-delete">
                                  </span>
                                  <span class="ww_icon icon_ApprovalItemAdd editItem_icon select-add">
                                  </span>
                                  <div class="inputWithTips_tips">
                                  </div>
                                </div>
                              </div>
                              <div content="选项2" class="editItem_selectItem">
                                <div class="editItem_select">
                                  <input type="text" class="qui_inputText ww_inputText ww_inputText_Big editItem_input"
                                  value="选项2" placeholder="选项名称">
                                  <span class="ww_icon icon_ApprovalItemDel editItem_icon select-delete">
                                  </span>
                                  <span class="ww_icon icon_ApprovalItemAdd editItem_icon select-add">
                                  </span>
                                  <div class="inputWithTips_tips">
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                          <div class="Edit_editItem">
                            <div class="editItem_title">
                              其他
                            </div>
                            <div class="editItem_content">
                              <label class="ww_label ww_label_Middle approvalEdit_templateEdit_editItem_label">
                                <input class="ww_checkbox js_validate" type="checkbox">
                                <span>
                                  必填
                                </span>
                              </label>
                            </div>
                          </div>
                        </div>
                      </li>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- contanier -->
  <!-- 控件库 -->
  <div class="editControl" style="display: none;">
    <div class="widget_dialog">
      <div class="dialog_title">
        控件库
      </div>
      <div class="dialog_content">
        <div class="dialog_item" data-type="text" data-title="text">
          <span class="ww_icon ww_icon_ApprovalText dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            文本
          </span>
        </div>
        <div class="dialog_item" data-type="textarea" data-title="textarea">
          <span class="ww_icon ww_icon_ApprovalTextarea dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            多行文本
          </span>
        </div>
        <div class=" dialog_item" data-type="number" data-title="text">
          <span class="ww_icon ww_icon_ApprovalNumber dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            数字
          </span>
        </div>
        <div class="dialog_item" data-type="date" data-title="text">
          <span class="ww_icon ww_icon_ApprovalDate dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            日期
          </span>
        </div>
        <div class="dialog_item" data-type="datehour" data-title="text">
          <span class="ww_icon ww_icon_ApprovalDatehour dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            日期+时间
          </span>
        </div>
        <div class="dialog_item" data-type="file" data-title="file">
          <span class="ww_icon ww_icon_ApprovalFile dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            附件
          </span>
        </div>
        <div class="dialog_item" data-type="price" data-title="select">
          <span class="ww_icon ww_icon_ApprovalPirce dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            金额
          </span>
        </div>
        <div class="dialog_item" data-type="select" data-title="select">
          <span class="ww_icon ww_icon_ApprovalSelect dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            单选框
          </span>
        </div>
        <div class="dialog_item" data-type="checkbox" data-title="select">
          <span class="ww_icon ww_icon_ApprovalCheckbox dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            多选框
          </span>
        </div>
        <!-- 新加的“发票”的控件 -->
        <div class="notetemplate" data-type="note" data-title="note">
          <span class="ww_icon ww_icon_ApprovalNote dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            发票
          </span>
        </div>
        <!-- 新加的“成果模板”的控件 -->
        <div class="achievetemplate " data-type="achieve" data-title="achieve">
          <span class="ww_icon ww_icon_Approvalachieve dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            成果模板
          </span>
        </div>
        <!-- 新加的“会议模板”的控件 -->
        <div class="meetingtemplate" data-type="meeting" data-title="meeting">
          <span class="ww_icon ww_icon_Approvalmeeting dialog_item_icon">
          </span>
          <span class="dialog_item_text">
            会议模板
          </span>
        </div>
      </div>
    </div>
  </div>
li {
  list-style: none;
}

.frame_cnt {
  width: 1080px;
  margin: 0 auto 20px;
  background-color: #FFF;
  border-radius: 4px;
  min-height: 592px;
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .15);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .15);
}

.ww_normalCntHead {
  position: relative;
  height: 40px;
  padding: 0 18px;
  background-color: #F5F5F5;
  border-bottom: 1px solid #DCE1E6;
  border-radius: 4px 4px 0 0;
}

.ww_normalCntHead_left {
  position: relative;
  z-index: 2;
  float: left;
}

.ww_normalCntHead_left .ww_btn {
  margin-top: 7px;
}

a.qui_btn,
a.qui_btn:hover {
  text-decoration: none;
}

.ww_btn_Back {
  padding: 0 6px;
}

.ww_btn {
  cursor: default;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#F8F8F8));
  background-image: -webkit-linear-gradient(top, #fff 0, #F8F8F8 100%);
  background-image: -o-linear-gradient(top, #fff 0, #F8F8F8 100%);
  background-image: linear-gradient(to bottom, #fff 0, #F8F8F8 100%);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFFFF", endColorstr="#FFF8F8F8", GradientType=0);
  border-radius: 2px;
  vertical-align: middle;
  border: 1px solid #AAA;
}

.ww_btn,
.ww_btn:hover {
  background-repeat: repeat-x;
}

.qui_btn {
  display: inline-block;
  margin: 0;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  min-width: 24px;
  height: 24px;
  padding: 0 12px;
  background: #F5F5F5;
  border: 1px solid #B4BEC8;
  line-height: 24px;
  outline: 0;
  cursor: pointer;
  text-align: center;
  font-size: 12px;
  color: #222;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ww_normalCntHead_title {
  position: absolute;
  left: 18px;
  right: 18px;
  top: 0;
  z-index: 1;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
  text-align: center;
}

.ww_normalCntHead_title_content {
  vertical-align: top;
}

.template_cont {
  padding: 30px 120px;
}

.app_approval .app_approval_custom_template {
  margin: 0 -20px;
}

.app_approval .app_stage_section {
  border-bottom: none;
}

.app_stage_section {
  padding-bottom: 28px;
  margin-bottom: 28px;
  border-bottom: 1px solid #E4E6E9;
  position: relative;
}

.Edit {
  position: relative;
  overflow: hidden;
  float: left;
  width: 350px;
}

.Edit_content {
  background: #f5f5f5;
  border: 1px solid #d6d6d6;
}

.Edit_content_p {
  position: relative;
  height: 40px;
  line-height: 40px;
  background-color: #4F77AA;
}

.Edit_content_title {
  font-size: 16px;
  color: #fff;
  position: absolute;
  width: 100%;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: normal;
}

.Edit_scroll {
  position: relative;
  height: 517px;
  overflow: hidden;
  overflow-y: auto;
  font-size: 12px;
}


/**文本框*/

.approvalEdit_panel {
  position: relative;
  margin-top: 12px;
  background-color: #FFF;
  font-size: 14px;
  display: block;
  margin-bottom: 1px;
}

.approvalEdit_panel:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  height: 1px;
  background-color: #D9D9D9;
  -webkit-transform: scale(.5);
  -ms-transform: scale(.5);
  transform: scale(.5);
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
}

.approvalEdit_panel:after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #D9D9D9;
  -webkit-transform: scaleY(.5);
  -ms-transform: scaleY(.5);
  transform: scaleY(.5);
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
}

.Selected {
  border: 1px solid #007ED3!important;
}

.panel_wrap {
  padding: 10px 15px;
  line-height: 24px;
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0);
  display: flex;
  align-items: center;
  font-size: 14px;
}

.panel_title {
  word-break: break-all;
  line-height: 20px;
  flex: 1;
}

.panel_input,
.panel_title,
.panel_wrap:hover .panel_close,
.HasContent,
.Selected .panel_close {
  display: block;
}

.panel_input {
  color: #868C98;
  white-space: nowrap;
  padding-left: 10px;
  overflow: hidden;
  text-align: right;
  height: 24px;
  flex: 1;
}

.panel_close {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
  cursor: pointer;
}

.icon_ApprovalItemClose {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  background-position: -645px -594px;
  width: 18px;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  height: 18px;
}

.ww_icon {
  display: inline-block;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

.approvalEdit_addWidget {
  position: relative;
  background: #fff;
  height: 42px;
  line-height: 42px;
  text-align: center;
  color: #416991;
  -webkit-box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, .2);
  box-shadow: 0 -1px 2px 0 rgba(0, 0, 0, .2);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  vertical-align: middle;
  font-size: 14px;
}

.approvalEdit_add_icon {
  display: inline-block;
  position: relative;
  vertical-align: 2px;
  margin-left: 16px;
}

.approvalEdit_add_icon:before {
  width: 12px;
  height: 2px;
  top: -5px;
  left: -14px;
}

.approvalEdit_add_icon:after {
  width: 2px;
  height: 12px;
  left: -9px;
  top: -10px;
}

.approvalEdit_add_icon:after,
.approvalEdit_add_icon:before {
  position: absolute;
  background-color: #2C6FB3;
  content: "";
}


/*控件详情*/

.template_edit {
  float: left;
  margin-left: 40px;
}

.Edit_editItem {
  margin-bottom: 20px;
}

.editItem_title {
  display: inline-block;
  text-align: right;
  float: left;
  width: 60px;
  font-size: 14px;
  color: #787878;
  line-height: 26px;
  height: 26px;
  margin-right: 20px;
}

.editItem_content {
  display: inline-block;
  line-height: 26px;
  font-size: 14px;
}

.ww_btnWithMenu .smart_menu_a,
.ww_btnWithMenu .ww_dropdownMenu_itemLink,
.ww_groupSelBtn_item_text,
.ww_inputText,
.ww_pointLoading_stage,
.ww_searchResult li,
.ww_telInput_zipCode .smart_menu_a,
.ww_telInput_zipCode .ww_dropdownMenu_itemLink,
.ww_treeMenu_item {
  white-space: nowrap;
}

.ww_inputText,
.ww_table_TextEllipsis td,
.ww_table_td_TextEllipsis {
  word-wrap: normal;
}

.app_approval .app_approval_custom_template .ww_inputWithTips_tips {
  display: none;
}

.Edit_editItem .ww_inputWithTips_tips {
  display: block;
}

.ww_inputWithTips_remindTips,
.ww_inputWithTips_tips,
.ww_manual_inputWithTips_tips {
  font-size: 12px;
  color: #787878;
  min-height: 16px;
  padding-top: 4px;
  line-height: 16px;
}

.item_edit {
  position: relative;
  margin-top: 30px;
  padding-top: 30px;
}

.editWidget_wrap {
  max-width: 490px;
}

.Edit_editItem {
  margin-bottom: 20px;
}

.editItem_title {
  display: inline-block;
  text-align: right;
  float: left;
  width: 60px;
  font-size: 14px;
  color: #787878;
  line-height: 26px;
  height: 26px;
  margin-right: 20px;
}

.editItem_content {
  display: inline-block;
  line-height: 26px;
  font-size: 14px;
}

.ww_inputText {
  font-size: 12px;
  word-break: keep-all;
}

.ww_btnWithMenu .smart_menu_a,
.ww_btnWithMenu .ww_dropdownMenu_itemLink,
.ww_groupSelBtn_item_text,
.ww_inputText,
.ww_pointLoading_stage,
.ww_searchResult li,
.ww_telInput_zipCode .smart_menu_a,
.ww_telInput_zipCode .ww_dropdownMenu_itemLink,
.ww_treeMenu_item {
  white-space: nowrap;
}

.qui_inputText {
  height: 18px;
}

.app_approval .app_approval_custom_template .ww_inputWithTips_tips {
  display: none;
}

.Edit_editItem .ww_inputWithTips_tips {
  display: block;
}

.ww_inputWithTips_remindTips,
.ww_inputWithTips_tips,
.ww_manual_inputWithTips_tips {
  font-size: 12px;
  color: #787878;
  min-height: 16px;
  padding-top: 4px;
  line-height: 16px;
}

.editItem_content .ww_textarea {
  resize: none;
  height: 70px;
  word-break: break-all;
}

.Edit_editItem .ww_inputText,
.approvalEdit_templateEdit_editItem .ww_textarea {
  width: 270px;
  font-size: 14px;
}

.ww_textarea {
  font-size: 14px;
}

.qui_textarea {
  height: 42px;
}

.qui_inputText,
.qui_textarea {
  display: block;
  width: 270px;
  line-height: 18px;
  padding: 3px 6px;
  background: #FFF;
  border: 1px solid #C7C7C7;
  /*border-radius: 2px;*/
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.approvalEdit_templateEdit_editItem_label {
  margin-right: 20px;
}

.ww_label_Middle {
  font-size: 13px;
}

.ww_label {
  font-size: 14px;
  line-height: 1.5;
}

.isWin .ww_label .ww_checkbox,
.isWin .ww_label .ww_radio {
  vertical-align: -3px;
}

.app_approval .app_approval_custom_template input {
  font-size: 13px;
}

.ww_label_Middle .ww_checkbox {
  margin-right: 5px;
  vertical-align: 0;
}

.ww_label .ww_checkbox {
  margin-right: 8px;
  vertical-align: 0;
}

.ww_checkbox,
.ww_radio {
  width: 14px;
  height: 14px;
}

.ww_label span {
  vertical-align: middle;
}

.ww_label_Middle {
  font-size: 13px;
}

.ww_label {
  font-size: 14px;
  line-height: 1.5;
}

.item_edit:after {
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  background-color: #E4E6E9;
  height: 1px;
  -webkit-transform: scaleY(.5);
  -ms-transform: scaleY(.5);
  transform: scaleY(.5);
}

.approvalEdit_save_btn {
  clear: both;
  position: relative;
  padding-top: 65px;
  text-align: left;
}

.approvalEdit_save_btn:before {
  content: " ";
  position: absolute;
  top: 44px;
  right: 0;
  height: 1px;
  background-color: #E4E6E9;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transform: scaleY(.5);
  -ms-transform: scaleY(.5);
  transform: scaleY(.5);
  left: 0;
}

a.qui_btn,
a.qui_btn:hover {
  text-decoration: none;
}

.ww_btn_Blue {
  border-color: #2084CA;
  color: #fff!important;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#4490D6), to(#357FB8));
  background-image: -webkit-linear-gradient(top, #4490D6 0, #357FB8 100%);
  background-image: -o-linear-gradient(top, #4490D6 0, #357FB8 100%);
  background-image: linear-gradient(to bottom, #4490D6 0, #357FB8 100%);
  background-repeat: repeat-x;
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#FF4490D6", endColorstr="#FF357FB8", GradientType=0);
}

.ww_btn {
  cursor: default;
  border-radius: 2px;
  vertical-align: middle;
  border: 1px solid #AAA;
}

.ww_btn,
.ww_btn:hover {
  background-repeat: repeat-x;
}

.qui_btn {
  display: inline-block;
  margin: 0;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  min-width: 24px;
  height: 24px;
  padding: 0 12px;
  /*background: #F5F5F5;*/
  border: 1px solid #B4BEC8;
  line-height: 24px;
  outline: 0;
  cursor: pointer;
  text-align: center;
  font-size: 12px;
  color: #222;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

a.qui_btn,
a.qui_btn:hover {
  text-decoration: none;
}

.ww_btn_Blue:hover {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#61A6E6), to(#4890C7));
  background-image: -webkit-linear-gradient(top, #61A6E6 0, #4890C7 100%);
  background-image: -o-linear-gradient(top, #61A6E6 0, #4890C7 100%);
  background-image: linear-gradient(to bottom, #61A6E6 0, #4890C7 100%);
  background-repeat: repeat-x;
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#FF61A6E6", endColorstr="#FF4890C7", GradientType=0);
  border-color: #2971A2;
  color: #fff;
}

.panel_content {
  display: block;
  clear: both;
  padding-top: 8px;
  padding-bottom: 5px;
  line-height: 20px;
  color: #868C98;
}

.panel_textarea {
  color: #868C98;
  word-break: break-all;
  line-height: 20px;
}

.icon_AddFileBtnPreview {
  background-position: 0 -397px;
}

.icon_AddBtnGray,
.icon_AddFileBtnPreview {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  width: 40px;
  height: 40px;
  display: block;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

.ww_icon {
  display: inline-block;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

.approvalEdit_panel_WithArrow .panel_wrap:before {
  content: " ";
  display: inline-block;
  height: 6px;
  width: 6px;
  border-width: 2px 2px 0 0;
  border-color: #C8C8CD;
  border-style: solid;
  -webkit-transform: matrix(.71, .71, -.71, .71, 0, 0);
  -ms-transform: matrix(.71, .71, -.71, .71, 0, 0);
  transform: matrix(.71, .71, -.71, .71, 0, 0);
  position: absolute;
  top: 50%;
  margin-top: -4px;
  right: 13px;
}

.approvalEdit_panel_WithArrow .panel_input {
  padding-right: 10px;
}

.approvalEdit_panel_tips {
  margin-top: 10px;
}

.approvalEdit_panel_tips .panel_wrap {
  color: #868C98;
  white-space: pre-wrap;
  word-break: break-all;
}

.approvalEdit_panel_list_content {
  background-color: #fff;
  margin-top: 0;
}

.approvalEdit_panel_list_title {
  padding-left: 15px;
  background-color: #f5f5f5;
  color: #777E8A;
  height: 32px;
  line-height: 28px;
}

.approvalEdit_panel_list_emptyTips {
  text-align: center;
  color: #787878;
  padding-top: 25px;
  background-color: #fff;
}

.approvalEdit_panel_list_addItem {
  padding: 11px 0;
  color: #416991;
  text-align: center;
  font-size: 13px;
  cursor: pointer;
}

.approvalEdit_panel_list_footer {
  position: relative;
  font-size: 14px;
  color: #787878;
  line-height: 38px;
  height: 38px;
  background-color: #fff;
  padding-left: 15px;
  margin-bottom: 1px;
}

.approvalEdit_panel_list_footer:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  height: 1px;
  background-color: #D9D9D9;
  -webkit-transform: scale(.5);
  -ms-transform: scale(.5);
  transform: scale(.5);
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
}

.approvalEdit_panel_list_footer_icon {
  position: relative;
  top: 4px;
  margin-right: 4px;
}

.ww_icon_ApprovalItemAdd {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  background-position: -645px -566px;
  width: 18px;
  height: 18px;
}

.approvalEdit_smart_wrap {
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0);
  cursor: move;
  margin-top: 12px;
}

.approvalEdit_panel_list {
  position: relative;
  margin-top: 12px;
  border: 0;
  background-color: #fff;
}

.approvalEdit_panel_list_close {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
  cursor: pointer;
}


/*  明细说明  */

.panel_list_content {
  background-color: #fff;
  margin-top: 0;
}

.panel_list_title {
  padding-left: 15px;
  background-color: #f5f5f5;
  color: #777E8A;
  height: 32px;
  line-height: 28px;
}

.panel_list_emptyTips {
  text-align: center;
  color: #787878;
  padding-top: 25px;
  background-color: #fff;
}

.panel_list_addItem {
  padding: 11px 0;
  color: #416991;
  text-align: center;
  font-size: 13px;
  cursor: pointer;
}

.panel_list_footer {
  position: relative;
  font-size: 14px;
  color: #787878;
  line-height: 38px;
  height: 38px;
  background-color: #fff;
  padding-left: 15px;
  margin-bottom: 1px;
}

.panel_list_footer:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  height: 1px;
  background-color: #D9D9D9;
  -webkit-transform: scale(.5);
  -ms-transform: scale(.5);
  transform: scale(.5);
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
}

.panel_list_footer_icon {
  position: relative;
  top: 4px;
  margin-right: 4px;
}

.ww_icon_ApprovalItemAdd {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  background-position: -645px -566px;
  width: 18px;
  height: 18px;
}

.smart_wrap {
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0);
  cursor: move;
  margin-top: 12px;
}

.panel_list {
  margin-top: 0;
  border: 0;
  background-color: #fff;
}

.panel_list_close {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
  cursor: pointer;
}


/*****控件库******/

.widget_dialog {
  position: absolute;
  z-index: 100;
  background: #FDFDFD;
  border: 0;
  border-radius: 4px;
  -webkit-box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .3);
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .3);
  width: 383px;
  padding: 15px 15px 0;
}

.dialog_title {
  text-align: left;
  font-size: 14px;
  line-height: 20px;
  margin-left: 10px;
  color: #000;
}

.dialog_content {
  margin-top: 10px;
  text-align: left;
}

.dialog_item {
  display: inline-block;
  width: 70px;
  height: 58px;
  border: 1px solid #E4E6E9;
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  cursor: pointer;
}

.dialog_item_icon {
  display: block;
  margin: 8px auto 0;
}

.ww_icon_ApprovalText {
  background-position: -577px -170px;
}

.ww_icon_ApprovalTextarea {
  background-position: -611px -34px;
}

.ww_icon_ApprovalNumber {
  background-position: -34px -549px;
}

.ww_icon_ApprovalDate {
  background-position: -540px -448px;
}

.ww_icon_ApprovalDatehour {
  background-position: -540px -312px;
}

.ww_icon_ApprovalFile {
  background-position: -306px -549px;
}

.ww_icon_ApprovalList {
  background-position: -510px -549px;
}

.ww_icon_ApprovalPirce {
  background-position: -540px -380px;
}

.ww_icon_ApprovalSelect {
  background-position: -577px -102px;
}

.ww_icon_ApprovalCheckbox {
  background-position: -577px 0;
}

.ww_icon_ApprovalDesc {
  background-position: -340px -549px;
}

.ww_icon_ApprovalSelect,
.ww_icon_ApprovalText,
.ww_icon_ApprovalTextarea,
.ww_icon_ApprovalList,
.ww_icon_ApprovalNumber,
.ww_icon_ApprovalDate,
.ww_icon_ApprovalDatehour,
.ww_icon_ApprovalFile,
.ww_icon_ApprovalPirce,
.ww_icon_ApprovalCheckbox,
.ww_icon_ApprovalDesc {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  width: 24px;
  height: 24px;
}

.dialog_item_text {
  display: block;
  font-size: 12px;
  margin-top: 4px;
  color: #4A5159;
}


/*未添加任何的控件时*/

.approvalEdit_empty {
  position: absolute;
  width: 100%;
  top: 150px;
  bottom: 0;
  margin: auto;
  text-align: center;
  color: #787878;
  font-size: 13px;
}

.approvalEdit_empty_icon {
  margin: 0 auto;
  width: 57px;
  height: 69px;
  background-image: url(http://www.gdaec.com.cn/resources/img/min/empty_icon.png);
  background-size: contain;
}

.approvalEdit_empty_text {
  margin-top: 18px;
}

.approvalEdit_empty_btn {
  position: relative;
  width: 97px;
  height: 32px;
  line-height: 32px;
  border: 1px solid #4F77AA;
  border-radius: 3px;
  color: #4F77AA;
  margin: 35px auto;
  padding-left: 13px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
}

.approvalEdit_empty_btn:before {
  width: 12px;
  height: 2px;
  top: 14px;
  left: 12px;
}

.approvalEdit_empty_btn:after {
  width: 2px;
  height: 12px;
  left: 17px;
  top: 9px;
}

.approvalEdit_empty_btn:after,
.approvalEdit_empty_btn:before {
  position: absolute;
  background-color: #2C6FB3;
  content: "";
}

.Edit_scroll li {
  position: relative;
}

.Edit_scroll li:hover .line {
  border: 1px dotted #007ED3 !important;
}


/*.Edit_scroll li:hover .icon_ApprovalItemClose{display: block !important;}*/


/*单选 + 多选*/

.editItem_checkboxItemWrap {
  max-width: 350px;
}

.editItem_selectItem {
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 10px;
  vertical-align: top;
}

.editItem_selectItem .editItem_input {
  width: 208px;
}

.editItem_icon,
.editItem_input {
  display: inline-block;
}

.ww_inputText_Big,
.ww_textarea_Big {
  width: 252px;
  padding: 5px 6px;
  font-size: 14px;
}

.editItem_icon {
  margin-top: 5px;
  margin-left: 7px;
  vertical-align: top;
  cursor: pointer;
}

.icon_ApprovalItemDel {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  background-position: 0 -637px;
  width: 18px;
  height: 18px;
}

.icon_ApprovalItemAdd {
  background-image: url(http://www.gdaec.com.cn/resources/img/min/icon.png);
  background-position: -645px -566px;
  width: 18px;
  height: 18px;
}

.ww_icon_ApprovalNote {
  width: 24px;
  height: 24px;
  background-image: url("http://www.gdaec.com.cn/resources/img/min/icon-new.png");
  background-repeat: no-repeat;
}

.notetemplate {
  display: inline-block;
  width: 70px;
  height: 58px;
  border: 1px solid #E4E6E9;
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  cursor: pointer;
}

.noteUnbind {
  background-image: url("http://www.gdaec.com.cn/resources/img/min/icon-new-unbind.png")
}


/*新增加的---成果模板--控件*/

.ww_icon_Approvalachieve {
  width: 24px;
  height: 24px;
  background-image: url("http://www.gdaec.com.cn/resources/img/min/icon-achieve.png");
  background-repeat: no-repeat;
}

.achievetemplate {
  display: inline-block;
  width: 70px;
  height: 58px;
  border: 1px solid #E4E6E9;
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  cursor: pointer;
}

.achieveUnbind {
  background-image: url("http://www.gdaec.com.cn/resources/img/min/icon-achieve-unbind.png")
}


/*新增加的---会议模板--控件*/

.ww_icon_Approvalmeeting {
  width: 24px;
  height: 24px;
  background-image: url("http://www.gdaec.com.cn/resources/img/min/icon-meeting.png");
  background-repeat: no-repeat;
}

.meetingtemplate {
  display: inline-block;
  width: 70px;
  height: 58px;
  border: 1px solid #E4E6E9;
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 20px;
  cursor: pointer;
}

.meetingUnbind {
  background-image: url("http://www.gdaec.com.cn/resources/img/min/icon-meeting-unbind.png")
}


/*新加入控件的样式*/

.table-option {
  position: relative;
  background-color: #f5f5f5;
  margin-bottom: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.optionAddBtn,
.optionDelBtn {
  cursor: pointer;
  color: #20a4f9;
  padding: 5px 0;
  margin-right: 14px
}

本项目引用的自定义外部资源