<%@ 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="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>