ECStore二次开发日记之10.后台模板编辑按钮边增加挂件坑的ID名

昨天,编辑同事说在后台编辑模板需要增加一个显示挂件坑ID的功能,如下图画圈圈的地方,这个功能确实很贴心,方便编辑人员定位源码所在位置,非常棒,今天抽空修改了一下,分享一下修改的地方吧。

ecstore_templete

首先,我们打开

  1. /public/app/site/statics/js_mini/shopwidgets.min.js
  2. /public/app/wap/statics/js_mini/shopwidgets.min.js

随便打开一个就好,1是PC端的,2是手机端的。我们拿2来讲解吧,1的修改其实都一样,可能有一些变量名不一样,而实际的程序是一样的。

因为这个脚本文件是压缩的噢,我们需要先解压“美化”一下,我经常用“Javascript压缩、美化”,推荐使用噢。

然后请找到大约40行checkEmptyDropPanel方法定义处:

在方法内我们可以看到

var b = (new Element(“div.empty_drop_box”)).set(“html”, ‘&nbsp;<button type=”button” class=”btn btn-add-widgets”><span><span><i class=”icon”></i>添加挂件</span></span></button>’).inject(a);

这一行代码,只要修改为:

var b = (new Element(“div.empty_drop_box”)).set(“html”, ‘&nbsp;<button type=”button” class=”btn btn-add-widgets”><span><span><i class=”icon”></i>添加挂件’ + ( (a.get(‘base_id’)&&a.get(‘base_id’).length>0)?’ [ ‘ + a.get(‘base_id’) + ‘ ] ‘:”) + ‘</span></span></button>’).inject(a);

保存,然后就可以实现我们上图中的下面的效果了~

再往下120行左右找到initDrags方法定义处,然后你会看到

h = $(h.target);

只需要在下面另起一行增加如下代码

if((WidgetEdit = h.getParent(‘.shopWidgets_panel’)) && WidgetEdit.get(‘base_id’) && WidgetEdit.get(‘base_id’).length > 0) c.getElement(‘.btn-edit-widgets’).innerHTML = “编辑 [ ” + WidgetEdit.get(‘base_id’) + ‘ ]’;

然后保存,效果实现了。

简单吧~~