<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="layout_edit.aspx.cs" Inherits="wac.Admin.admin.app.layout_edit" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>布局编辑</title>
<link href="../skin/default/style.css" rel="stylesheet" type="text/css" />
</head>
<body class="mainbody" ng-app="myApp" ng-controller="myCtrl">
<form id="form1" onsubmit="return onsu();" runat="server">
<!--导航栏-->
<div class="location">
<a href="layout_manage.aspx" class="back"><i></i><span>返回列表页</span></a>
<a href="../center.aspx" class="home"><i></i><span>首页</span></a>
<i class="arrow"></i>
<span>布局编辑</span>
</div>
<div class="line10"></div>
<!--/导航栏-->
<!--内容-->
<div class="content-tab-wrap">
<div id="floatHead" class="content-tab">
<div class="content-tab-ul-wrap">
<ul>
<li><a href="javascript:;" onclick="tabs(this);" class="selected">基本信息</a></li>
<li><a href="javascript:;" onclick="tabs(this);">组件元素</a></li>
</ul>
</div>
</div>
</div>
<div class="tab-content">
<dl>
<dt>名称</dt>
<dd>
<input type="hidden" name="Id" id="Id" value="{{Id}}" />
<input type="text" name="Name" id="Name" class="input normal" datatype="*2-100" sucmsg=" " ng-model="layout.Name"/>
<span class="Validform_checktip">*名称最多100个字符</span>
</dd>
</dl>
<dl>
<dt>标题</dt>
<dd>
<input type="text" name="Title" id="Title" class="input normal" datatype="*2-100" sucmsg=" " ng-model="layout.Title"/>
<span class="Validform_checktip">*标题最多100个字符</span>
</dd>
</dl>
<dl>
<dt>数据Key</dt>
<dd>
<input type="text" name="Datakey" id="Datakey" class="input normal" datatype="*2-100" sucmsg=" " ng-model="layout.Datakey"/>
<span class="Validform_checktip">*名称最多100个字符</span>
</dd>
</dl>
<dl>
<dt>图片</dt>
<dd>
<input type="text" name="Img_url" id="Img_url" class="input normal upload-path" ng-model="layout.Img_url"/>
<div class="upload-box upload-img"></div>
<br/><img ng-src="{{layout.Img_url}}" />
</dd>
</dl>
<dl>
<dt>所属视图</dt>
<dd>
<div class="rule-single-select">
<select name="ViewId" id="ViewId" ng-model="ViewId" >
<option value="1">APP首页</option>
<option value="2">个人中心</option>
</select>
</div>
</dd>
</dl>
<dl>
<dt>是否上架</dt>
<dd>
<div class="rule-single-select">
<select name="Is_show" id="Is_show" ng-model="Is_show" >
<option value="1">上架</option>
<option value="0">下架</option>
</select>
</div>
</dd>
</dl>
<dl>
<dt>链接方式</dt>
<dd>
<input type="text" name="Request" id="Request" class="input normal" datatype="*2-100" sucmsg=" " ng-model="layout.Request"/>
<span class="Validform_checktip">*最多100个字符</span>
</dd>
</dl>
<dl>
<dt>样式</dt>
<dd>
<input type="text" name="Style" id="Style" class="input normal" datatype="*0-300" ng-model="layout.Style"/>
<span class="Validform_checktip">*最多300个字符</span>
</dd>
</dl>
<dl>
<dt>排序</dt>
<dd>
<input type="text" name="SortId" id="SortId" class="input small" datatype="n" sucmsg=" " ng-model="layout.SortId"/>
<span class="Validform_checktip">*数字，越小越向前</span>
</dd>
</dl>
</div>
<div class="tab-content" style="display:none;height:auto;" >
<a href="javascript:;" ng-click="addItem()" id="add_item" style="color: blue; margin-left: 10px;">添加组件元素</a><br/>
<div style=" ">
<ul id="LayoutContainer" class="inner-list" >
<li data-Id="{{x.Id}}" class="inner-item" ng-repeat="x in LayoutItems" on-last-repeat style="clear:both;">
<dl class="left">
<input type="hidden" name="itemkeys" id="itemkeys" value="{{x.Id}}"/>
<dt>名称：</dt>
<dd><input type="text" class="input normal" name="data-Name_{{x.Id}}" value="{{x.Name}}" /></dd>
<dt>标题：</dt>
<dd><input type="text" class="input normal" name="data-Title_{{x.Id}}" value="{{x.Title}}" /></dd>
<dt>链接方式：</dt>
<dd><input type="text" class="input small" name="data-Request_{{x.Id}}" value="{{x.Request}}" /></dd>
<dt>样式：</dt>
<dd><input type="text" class="input normal" name="data-Style_{{x.Id}}" value="{{x.Style}}" /></dd>
<dt>数据Key：</dt>
<dd><input type="text" class="input normal" name="data-Datakey_{{x.Id}}" value="{{x.Datakey}}" /></dd>
<dt> 排序：</dt>
<dd><input type="text" class="input small" name="data-SortId_{{x.Id}}" value="{{x.SortId}}" /></dd>
<dt>图片：</dt>
<dd>
<input class="input normal upload-path" type="text" name="data-Img_url_{{x.Id}}" ng-model="x.Img_url" />
<div class="upload-box upload-img"></div>
<br/><img ng-src="{{x.Img_url}}" />
</dd>
<dt>Url：</dt>
<dd><input type="text" class="input normal" name="data-Url_{{x.Id}}" value="{{x.Url}}" /></dd>
</dl>
<a href="javascript:;" title="删除" class="inner-close left" style="font-size:large;" ng-click="remove(x)">×</a>
<div class="clear" style="width:440px; margin-left:40px;border:none; border-bottom:1px dashed #000000" />
</li>
</ul>
</div>
</div>
<!--<pre>{{LayoutItems|json}}</pre>-->
<!--工具栏-->
<div class="page-footer">
<div class="btn-list">
<input type="submit" class="btn" id="btnSubmit" value="提交保存" name="btnSubmit" />
<input name="btnReturn" type="button" value="返回上一页" class="btn yellow" onclick="javascript: history.back(-1);" />
</div>
<div class="clear"></div>
</div>
<!--/工具栏-->
</form>
<script type="text/javascript" src="../../scripts/jquery/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="../../scripts/angular1.4.6.min.js"></script>
<script type="text/javascript" src="../../scripts/swfupload/swfupload.js"></script>
<script type="text/javascript" src="../../scripts/swfupload/swfupload.queue.js"></script>
<script type="text/javascript" src="../../scripts/swfupload/swfupload.handlers.js"></script>
<script type="text/javascript" src="../../scripts/jquery/Validform_v5.3.2_min.js"></script>
<script type="text/javascript" src="../../scripts/lhgdialog/lhgdialog.js?skin=idialog"></script>
<script type="text/javascript" src="../js/layout.js"></script>
<script type="text/javascript">
/***********郭旺成 2016-04-15 westfruit@163.com 13631628737**********/
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope, $http) {
$scope.Id = <%=CurLayout.Id %>;
$scope.layout = {};
$scope.LayoutItems = [];
$scope.ViewId = "1";
$scope.Is_show = "1";
$scope.convertToInt = function (id) {
return parseInt(id);
};
$scope.addItem = function () {
var item = { Id: Math.round(new Date().getTime()), Name: '', Title: '', Request: '', Style: '', Datekey: '', SortId: 0, Url: '', Img_url: '' };
$scope.LayoutItems.push(item);
initupload();
}
$scope.remove = function (item) {
$scope.LayoutItems.splice($scope.LayoutItems.indexOf(item), 1);
};
$scope.loaddata = function () {
$http({
method: "POST",
url: 'layout_manage.aspx/WebMethod_GetLayout',
data: "{'id':" + $scope.Id + "}",
headers: {
'Content-Type': 'application/json; charset=utf-8'
}
}).
success(function (data, status) {
if (status == 200) {
var realobj = eval("(" + data.d + ")");
$scope.layout = realobj
$scope.ViewId = realobj.ViewId.toString();
$scope.Is_show = realobj.Is_show.toString();
$scope.LayoutItems = realobj.LayoutItems;
initupload();
}
}).
error(function (data, status) {
});
}
$scope.loaddata();
});
app.directive('onLastRepeat', function () {
return function (scope, element, attrs) {
/*$emit只能向parent controller传递event与data*/
/*$broadcast只能向child controller传递event与data*/
/*$on用于接收event与data*/
if (scope.$last) setTimeout(function () {
scope.$emit('onRepeatLast', element, attrs);
}, 1);
setTimeout(function () {
$(element).find(".upload-img").InitSWFUpload({ sendurl: "../../tools/upload_ajax.ashx", thumbnail: false, single: false, flashurl: "../../scripts/swfupload/swfupload.swf", filesize: "20480", filetypes: "*.jpg;*.png;*.gif;" });
},1);
};
});
$(function () {
//初始化上传控件
$(".upload-img").each(function () {
$(this).InitSWFUpload({ sendurl: "../../tools/upload_ajax.ashx", thumbnail: false, single: false, flashurl: "../../scripts/swfupload/swfupload.swf", filesize: "20480", filetypes: "*.jpg;*.png;*.gif;" });
});
$("#btnSubmit").click(function () {
return true;
});
});
//重写覆盖图片上传成功处理方法
function addImage(targetObj, originalSrc, thumbSrc) {
$(targetObj).siblings(".upload-path").val(originalSrc);
$(targetObj).siblings("img").attr("src",originalSrc);
}
</script>
</body>
</html>
