搭配提交

weiqingting
Commit 20e45a8d9efb68c3e2a888a60d31b586b5f3f17d 1 parent 24f35af6
Showing 4 changed files with 181 additions and 9 deletions
client/js/goods/partials/editor_recommend.js
client/sass/module/_edit.scss
server/interface/netSaleWq.js
server/views/partials/netsale/close-match.html
--- a/client/js/goods/partials/editor_recommend.js
View file @20e45a8
+++ b/client/js/goods/partials/editor_recommend.js
View file @20e45a8
@@ -56,7 +56,9 @@ var g=new common.grid({
 	},
 	columns:[
 		{display:"ID",name:"id"},
-		{display:"图片",name:"imageUrl"},
+		{display:"图片",name:"imageUrl",render:function(item){
+			return "<img src="+item.imageUrl+" width=120 height=80 />";
+		}},
 		{display:"介绍",name:"content"},
 		{display:"排序",name:"orderBy"},
 		{display:"发表时间",render:function(item){
@@ -73,9 +75,87 @@ var g=new common.grid({
 g.init('/netSale/selectCollocationListBySkn');
+var Bll={
+	posData:[],
+	toast:function(title,item,url){
+		var e=new common.edit("#dapei-form",{
+			bucket:"goodsimg"
+		});
+		
+		var d=new common.dialog({
+			title:title,
+			width:1200,
+			content:common.util.__template2($("#wqt-template1").html(),item),
+			button:[
+				{
+					value:"提交",
+					callback:function(){
+						e.submit(url,function(option){
+							option.data.id=item.id;
+							option.data.productSkn=productSkn;
+							option.data.infoStr=JSON.stringify(Bll.posData);
+							console.log(option.data);
+							option.success=function(res){
+								res = res.data;
+				                if(res.code == +"200") {
+				                    e.$tip("提交成功", function() {
+				                        d.close();
+				                        g.reload();
+				                    }, 'growl-success');
+				                }else{
+				                    e.$tip(res.message);
+				                }
+							}
+						});
+						return false;
+					},
+					css: "btn-primary"
+				},
+				{
+					value:"取消"
+				}
+			]
+		});
+
+		e.init();
+		e.on("callback", function(obj) {
+		    if (obj.key == "file_onComplete_imageUrl") {
+		        // $("#editimg").attr("src",obj.data);
+		        $(".poseditimg").html("<img src='"+obj.data+"'/>");
+		    }
+		});
+	}
+}
+/*编辑*/
+
+$(document).on("dblclick",".poseditimg img",function(e){
+	var pos={
+		top:e.pageY-$(this).offset().top,
+		left:e.pageX-$(this).offset().left
+	}
+	Bll.posData.push(pos);
+	var _pos=$(common.util.__template2($("#kapian").html(),{__index:Bll.posData.length-1}));
+	_pos.css({
+		top:pos.top+"px",
+		left:pos.left+"px"
+	});
+	
+	$(".poseditimg").append(_pos);
+});
+$(document).on("click",".poseditimg .close",function(e){
+	var index=$(this).data("index");
+	$(this).parent(".pos").remove();
+	Bll.posData.splice(index,1);
+});
+$(document).on("change",".poseditimg .pos-text",function(){
+	var item=Bll.posData[$(this).data("index")];
+	item.id=$(this).val();
+});
+
+
 //添加
 $(document).on("click","#dapeiadd",function(){
-	
+	Bll.toast("添加搭配",{},"/netSale/insertCollocation");
 });
 //保存
 $(document).on("click","#dapeisave",function(){
@@ -83,12 +163,28 @@ $(document).on("click","#dapeisave",function(){
 });
 //删除
 $(document).on("click","#dapeiTable .delete",function(){
-	var __index=$(this).data("index");
-	g.rows.splice(__index,1);
-	g.reload();
+	var item=g.rows[$(this).data("index")];
+	common.util.__ajax({
+		url:'/netSale/delCollocationById',
+		data:{
+			param:item.id
+		}
+	},function(){
+		g.reload();
+	});
 });
 //修改
 $(document).on("click","#dapeiTable .edit",function(){
-	
+	var item=g.rows[$(this).data("index")];
+	// common.util.__ajax({
+	// 	url:'/netSale/selectCollocationById',
+	// 	data:{
+	// 		param:item.id
+	// 	}
+	// },function(data){
+	// 	Bll.toast("添加搭配",data.data,"/netSale/updateCollocation");
+	// });
+	item.infoStr=[{"top":223,"left":380,"id":"ffffff"},{"top":454,"left":309,"id":"ggggg"}];
+	Bll.toast("添加搭配",item,"/netSale/updateCollocation");
 });
--- a/client/sass/module/_edit.scss
View file @20e45a8
+++ b/client/sass/module/_edit.scss
View file @20e45a8
@@ -62,4 +62,23 @@ input[type=date], input[type=time], input[type=datetime-local], input[type=month
         height: 100%;
         line-height: 150px;
     }
+}
+.poseditimg{
+    position: relative;
+    width: 700px;
+    height: 600px;
+    img{
+        display: block;
+        width: 100%;
+        height: 100%;
+    }
+    .pos{
+        position: absolute;
+        z-index: 10;
+        width: 220px;
+        .pos-text{
+            border:0 none;
+            border-bottom:1px solid #ccc; 
+        }
+    }
 }
--- a/server/interface/netSaleWq.js
View file @20e45a8
+++ b/server/interface/netSaleWq.js
View file @20e45a8
@@ -40,6 +40,17 @@ exports.res = [
 		{name: 'param', type: 'Number'}
 	]
 },
+{//添加单个搭配
+	route:'/netSale/insertCollocation',
+	method:'POST',
+	url: '/collocation/insertCollocation',
+	params: [
+		{name: 'productSkn', type: 'Number'},
+		{name: 'imageUrl', type: 'String'},
+		{name: 'content', type: 'String'},
+		{name: 'infoStr', type: 'String'}
+	]
+},
 {//更新单个搭配
 	route:'/netSale/updateCollocation',
 	method:'POST',
--- a/server/views/partials/netsale/close-match.html
View file @20e45a8
+++ b/server/views/partials/netsale/close-match.html
View file @20e45a8
@@ -4,18 +4,64 @@
             <div class="panel-btns" style="display: none;">
                 <a href="" class="panel-minimize tooltips" data-toggle="tooltip" title=""><i class="fa fa-minus"></i></a>
             </div>
-            <h2 class="panel-title">搭配搭配</h2>
+            <h2 class="panel-title">搭配</h2>
         </div>
         <div class="panel-body nopadding">
-            <button class="btn btn-primary" id="dapeiadd">添加</button>
+            
             <div id="dapeiTable"></div>
         </div>
         <div class="panel-footer">
+            <button class="btn btn-primary" id="dapeiadd">添加搭配</button>
             <button class="btn btn-primary" id="dapeisave">保存</button>
         </div>
     </form>
 </div>
 <script type="text/template" id="wqt-template1">
-    
+<div class="rows">
+    <div class="form-group">
+        <div class="col-sm-8">
+            <div class="poseditimg">
+                [[if imageUrl]]
+                <img src="[[imageUrl]]">
+                [[/if]]
+                [[each infoStr as item __index]]
+                    <div class="pos form-control" style="left:[[item.left]]px;top:[[item.top]]px;">
+                        <input type="text" class="pos-text" data-index='[[__index]]' value="[[item.id]]" />
+                        <span class="close" data-index='[[__index]]'>×</span>
+                    </div>
+                [[/each]]
+            </div>
+        </div>
+        <div class="col-sm-4">
+            <div class="rows" id="dapei-form">
+                <div class="form-group">
+                    <label for="endTime" class="col-sm-2 control-label"><i class="red">*</i> 介绍</label>
+                    <div class="col-sm-10">
+                        <input type="text" id="content" class="form-control panel-input hasDatepicker" placeholder="介绍" value="[[content]]" required>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label for="endTime" class="col-sm-2 control-label"><i class="red">*</i> 图片</label>
+                    <div class="col-sm-10">
+                        <input type="file" id="imageUrl" name="imageUrl" value="[[imageUrl]]" required/>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label for="endTime" class="col-sm-2 control-label"><i class="red">*</i> 排序</label>
+                    <div class="col-sm-10">
+                     <input type="number" id="orderBy" class="form-control panel-input hasDatepicker" placeholder="排序" value="[[orderBy]]" required>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+</script>
+
+<script type="text/template" id="kapian">
+    <div class="pos form-control">
+        <input type="text" class="pos-text" data-index='[[__index]]' value="[[id]]" />
+        <span class="close" data-index='[[__index]]'>×</span>
+    </div>
 </script>