index.html 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <?php $shoname_name = D('Home/Front')->get_config_by_name('shoname'); ?>
  6. <title><?php echo $shoname; ?></title>
  7. <link rel="shortcut icon" href="" />
  8. <meta name="renderer" content="webkit">
  9. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  10. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  11. <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
  12. <!-- 让IE8/9支持媒体查询,从而兼容栅格 -->
  13. <!--[if lt IE 9]>
  14. <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  15. <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
  16. <![endif]-->
  17. <link href="./resource/css/bootstrap.min.css?v=201903260001" rel="stylesheet">
  18. <link href="./resource/css/common.css?v=201903260001" rel="stylesheet">
  19. <script type="text/javascript">
  20. window.sysinfo = {
  21. <?php if (!empty($_W['uniacid']) ){ ?>'uniacid': '{$_W['uniacid']}',<?php } ?>
  22. <?php if( !empty($_W['acid']) ){ ?>'acid': '{$_W['acid']}',<?php } ?>
  23. <?php if (!empty($_W['openid']) ) { ?>'openid': '{$_W['openid']}',<?php } ?>
  24. <?php if( !empty($_W['uid']) ) { ?>'uid': '{$_W['uid']}',<?php } ?>
  25. 'isfounder': <?php if (!empty($_W['isfounder']) ) { ?>1<?php }else{ ?>0<?php } ?>,
  26. 'siteroot': '{$_W['siteroot']}',
  27. 'siteurl': '{$_W['siteurl']}',
  28. 'attachurl': '{$_W['attachurl']}',
  29. 'attachurl_local': '{$_W['attachurl_local']}',
  30. 'attachurl_remote': '{$_W['attachurl_remote']}',
  31. 'module' : {'url' : '<?php if( defined('MODULE_URL') ) { ?>{MODULE_URL}<?php } ?>', 'name' : '<?php if (defined('IN_MODULE') ) { ?>{IN_MODULE}<?php } ?>'},
  32. 'cookie' : {'pre': ''},
  33. 'account' : {:json_encode($_W['account'])},
  34. };
  35. </script>
  36. <script type="text/javascript" src="./resource/js/lib/jquery-1.11.1.min.js"></script>
  37. <script type="text/javascript" src="/static/js/diy/vue.min.js"></script>
  38. <script src="/static/js/diy/ddsort.js"></script>
  39. <script>
  40. var random = Math.random();
  41. document.write('<link href="/static/css/diy/shopdiy.css?v=' + random + '" rel="stylesheet" type="text/css"/>');
  42. </script>
  43. <script>
  44. var random = Math.random();
  45. document.write('<link href="/static/js/diy/color_picker/css/colorpicker.css?v=' + random + '" rel="stylesheet" type="text/css"/>');
  46. </script>
  47. <script type="text/javascript" src="./resource/js/lib/bootstrap.min.js"></script>
  48. <script type="text/javascript" src="./resource/js/app/util.js?v=201903260001"></script>
  49. <script type="text/javascript" src="./resource/js/app/common.min.js?v=201903260001"></script>
  50. <script type="text/javascript" src="./resource/js/require.js?v=201903260001"></script>
  51. <script type="text/javascript" src="./resource/js/lib/jquery.nice-select.js?v=201903260001"></script>
  52. <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
  53. <link href="/static/css/snailfish.css" rel="stylesheet">
  54. <script>
  55. //初始化高度
  56. $(function () {
  57. var lf_height = $(document).height() - $('#modify-view').offset().top - 28;
  58. $('#modify-view').css('height', lf_height + 'px');
  59. $('.all_component_list').css('height', lf_height + 'px');
  60. })
  61. </script>
  62. </head>
  63. <body layadmin-themealias="default">
  64. <div class="layui-fluid">
  65. <div class="layui-card">
  66. <div class="layui-card-body">
  67. <!-- begin modify -->
  68. <div id="modify-view">
  69. <!-- left component begin -->
  70. <div class="all_component_list">
  71. <div class="componnet_list_box">
  72. <foreach name="diyview" item="vo" key="k">
  73. <div class="component_title" data-index="{$k}">
  74. <img src="/static/images/diy/down.png">{$vo.type_name}
  75. </div>
  76. <ul data-index="{$k}">
  77. <if condition="$vo['type'] == 'SYSTEM' && $name != 'DIYVIEW_GOODS_CATEGORY'">
  78. <!-- <li title="弹出广告" v-on:click='addSzyComponent("popadv")'>
  79. <img src="/static/images/diy/ad.png">
  80. <span>弹出广告</span>
  81. </li> -->
  82. </if>
  83. <foreach name="vo.list" item="li" key="li_k">
  84. <li
  85. title="{$li.title}"
  86. <if condition="$li.value">
  87. v-on:click='addSzyComponent({$li.value},{ controller: "{$li.controller}", name : "{$li.name}", title : "{$li.title}", max_count : {$li.max_count}, addon_name : "{$li.addon_name}", controller : "{$li.controller}", is_delete : "{$li.is_delete}" })'
  88. v-bind:class="{ 'disabled' : !checkComponentIsAdd('{$li.name}',{$li.max_count}) }"
  89. <else/>class="disabled"</if>
  90. >
  91. <img src="{$li.icon}" data-icon="{$li.icon}" data-icon-selected="{$li.icon_selected}" >
  92. <span>{$li.title}</span>
  93. </li>
  94. </foreach>
  95. </ul>
  96. </foreach>
  97. </div>
  98. </div>
  99. <!-- left component end -->
  100. <!-- center component begin -->
  101. <div class="preview-box">
  102. <div class="preview-div">
  103. <div class="preview-screen">
  104. <button class="layui-btn layui-btn-primary position-page-btn"
  105. v-on:click="changeCurrentIndex(-99)">页面设置</button>
  106. <div class="screen_center_wrap">
  107. <div class="view-wrap" id="viewWrap">
  108. <div class="screen_head">
  109. <div class="preview-head_div"
  110. v-bind:style="{ backgroundColor : global.topNavColor,color:global.textNavColor}">
  111. <div class="search">
  112. <span v-bind:style="{ textAlign:global.textImgPosLink}">{{global.title}}</span>
  113. </div>
  114. </div>
  115. <!-- 全局设置项目 begin -->
  116. <div v-bind:class="{selected : currentIndex==-99}" v-bind:data-sort="-99"
  117. style="display:none;" v-show="data.length==0 || currentIndex==-99">
  118. <div class="edit-attribute">
  119. <div class="attr-wrap">
  120. <div class="restore-wrap">
  121. <h2 class="attr-title">页面设置</h2>
  122. <div class="layui-form-item">
  123. <label class="layui-form-label sm">页面名称</label>
  124. <div class="layui-input-block">
  125. <input type="text" v-model="global.title"
  126. placeholder="请输入页面名称" class="layui-input"
  127. maxlength="15">
  128. </div>
  129. </div>
  130. <div class="layui-form-item">
  131. <label class="layui-form-label sm">首页展示</label>
  132. <div class="layui-input-block">
  133. <div class="flex_fill">
  134. <div v-on:click="global.openDiyPage=0" v-bind:class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (global.openDiyPage==0) }">
  135. <i class="layui-anim layui-icon">&#xe63f;</i>
  136. <div>旧版首页</div>
  137. </div>
  138. <div v-on:click="global.openDiyPage=1" v-bind:class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (global.openDiyPage==1) }">
  139. <i class="layui-anim layui-icon">&#xe63f;</i>
  140. <div>新版“首页DIY”</div>
  141. </div>
  142. </div>
  143. <div class="ns-word-aux ns-diy-word-aux" style="margin-left: 0;">
  144. 小程序设置新版 “首页DIY” 以后,“小程序首页”内容根据“首页DIY”设置的内容进行展示,商城其他“首页”设置会无效。如还使用商城“首页”设置请切换至“旧版首页”
  145. </div>
  146. </div>
  147. </div>
  148. <div class="template-edit-title">
  149. <h3>页面显示样式</h3>
  150. <i class="layui-icon layui-icon-down"
  151. onclick="closeBox(this)"></i>
  152. </div>
  153. <div class="template-edit-wrap">
  154. <template>
  155. <color
  156. v-bind:data="{ field : 'bgColor', label : '页面颜色', value : global.bgColor, defaultcolor : '#f6f6f6', global: 1 }">
  157. </color>
  158. <color
  159. v-bind:data="{ field : 'topNavColor', label : '顶部颜色', value : global.topNavColor, defaultcolor : '#ffffff', global: 1 }">
  160. </color>
  161. <div class="layui-form-item flex">
  162. <div class="flex_left">
  163. <label class="layui-form-label sm">标题颜色</label>
  164. <div class="curr_color"></div>
  165. </div>
  166. <div class="layui-input-block flex_fill">
  167. <div v-on:click="global.textNavColor='#000000'" v-bind:class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (global.textNavColor=='#000000') }">
  168. <i class="layui-anim layui-icon">&#xe63f;</i>
  169. <div>黑色</div>
  170. </div>
  171. <div v-on:click="global.textNavColor='#ffffff'" v-bind:class="{ 'layui-unselect layui-form-radio' : true,'layui-form-radioed' : (global.textNavColor=='#ffffff') }">
  172. <i class="layui-anim layui-icon">&#xe63f;</i>
  173. <div>白色</div>
  174. </div>
  175. </div>
  176. </div>
  177. </template>
  178. <div class="layui-form-item">
  179. <label class="layui-form-label sm">背景图片</label>
  180. <div class="layui-input-block ns-img-upload">
  181. <img-sec-upload v-bind:data="{ data : global, field : 'bgUrl', text: '' }">
  182. </img-sec-upload>
  183. </div>
  184. </div>
  185. </div>
  186. </div>
  187. </div>
  188. </div>
  189. </div>
  190. <!-- 全局设置项目 end -->
  191. </div>
  192. <!--画布中心 begin -->
  193. <div class="screen_center" style="background-size: contain;background-position: top center;background-repeat: no-repeat;" v-bind:style="{ backgroundColor : global.bgColor,backgroundImage : 'url('+global.bgUrl+')' }">
  194. <template v-for="(nc,index) in data" v-bind:k="index">
  195. <div
  196. v-bind:data-index="index"
  197. v-on:click="changeCurrentIndex(nc.index)"
  198. v-bind:class="{ 'draggable-element nc-border-color-selected' : true,selected : currentIndex == nc.index }"
  199. v-bind:data-sort="index"
  200. >
  201. <foreach name="diyview" item="vo">
  202. <foreach name="vo.list" item="li">
  203. <template v-if="nc.type == '{$li.name}'">
  204. <if condition="$li['name']=='TEXT'">
  205. <include file="./static/diycomponent/text/index.html" />
  206. </if>
  207. <if condition="$li['name']=='NOTICE'">
  208. <include file="./static/diycomponent/notice/index.html" />
  209. </if>
  210. <if condition="$li['name']=='GRAPHIC_NAV'">
  211. <include file="./static/diycomponent/graphic_nav/index.html" />
  212. </if>
  213. <if condition="$li['name']=='SEARCH'">
  214. <include file="./static/diycomponent/search/index.html" />
  215. </if>
  216. <if condition="$li['name']=='HORZ_LINE'">
  217. <include file="./static/diycomponent/horz_line/index.html" />
  218. </if>
  219. <if condition="$li['name']=='HORZ_BLANK'">
  220. <include file="./static/diycomponent/horz_blank/index.html" />
  221. </if>
  222. <if condition="$li['name']=='RICH_TEXT'">
  223. <include file="./static/diycomponent/rich_text/index.html" />
  224. </if>
  225. <if condition="$li['name']=='GOODS_LIST'">
  226. <include file="./static/diycomponent/goods_list/index.html" />
  227. </if>
  228. <if condition="$li['name']=='RUBIK_CUBE'">
  229. <include file="./static/diycomponent/rubik_cube/index.html" />
  230. </if>
  231. <if condition="$li['name']=='COMMUNITY_SHOW'">
  232. <include file="./static/diycomponent/community_show/index.html" />
  233. </if>
  234. <if condition="$li['name']=='SLIDER'">
  235. <include file="./static/diycomponent/slider/index.html" />
  236. </if>
  237. <if condition="$li['name']=='COUPON'">
  238. <include file="./static/diycomponent/coupon/index.html" />
  239. </if>
  240. <if condition="$li['name']=='PINTUAN_LIST'">
  241. <include file="./static/diycomponent/pintuan/index.html" />
  242. </if>
  243. <if condition="$li['name']=='SECKILL_LIST'">
  244. <include file="./static/diycomponent/seckill/index.html" />
  245. </if>
  246. <if condition="$li['name']=='FLOAT_BTN'">
  247. <include file="./static/diycomponent/float_btn/index.html" />
  248. </if>
  249. <if condition="$li['name']=='VIDEO'">
  250. <include file="./static/diycomponent/video/index.html" />
  251. </if>
  252. <if condition="$li['name']=='NEW_COME'">
  253. <include file="./static/diycomponent/new_come/index.html" />
  254. </if>
  255. <if condition="$li['name']=='SPECIAL_LIST'">
  256. <include file="./static/diycomponent/special/index.html" />
  257. </if>
  258. <if condition="$li['name']=='MANY_GOODS_LIST'">
  259. <include file="./static/diycomponent/many_goods_list/index.html" />
  260. </if>
  261. <if condition="$li['name']=='SINGLE_IMG'">
  262. <include file="./static/diycomponent/single_img/index.html" />
  263. </if>
  264. </template>
  265. </foreach>
  266. </foreach>
  267. </div>
  268. </template>
  269. </div>
  270. <!--画布中心 end -->
  271. </div>
  272. </div>
  273. </div>
  274. </div>
  275. </div>
  276. <!-- center component end -->
  277. <!-- 底部 保存 begin -->
  278. <div class="custom-save">
  279. <button class="layui-btn ns-bg-color save">保存</button>
  280. </div>
  281. <!-- 底部 end -->
  282. </div>
  283. <!-- end modify -->
  284. </div>
  285. </div>
  286. </div>
  287. <script type="text/javascript">
  288. document.write('<script src="/static/js/diy/color_picker/js/colorpicker.js?t="' + Math.random() + '><\/script>');
  289. </script>
  290. <script type="text/javascript">
  291. document.write('<script src="/static/js/diy/color_picker/js/paigusu.min.js?t="' + Math.random() + '><\/script>');
  292. </script>
  293. <script type="text/javascript">
  294. var linkUrl = "{:U('Shopdiy/link')}";
  295. var specialUrl = "{:U('Marketing/special_select')}";
  296. document.write('<script type="text/javascript" charset="utf-8" src="/static/js/diy/common.js?t="' + Math.random() + '><\/script>');
  297. </script>
  298. <script type="text/javascript">
  299. document.write('<script src="/static/js/diy/async_load_css.js?t="' + Math.random() + '><\/script>');
  300. </script>
  301. <script type="text/javascript" charset="utf-8" src="__PUBLIC__/ueditor/ueditor.config.js"></script>
  302. <script type="text/javascript" charset="utf-8" src="__PUBLIC__/ueditor/ueditor.all.min.js"> </script>
  303. <script type="text/javascript" charset="utf-8" src="__PUBLIC__/ueditor/lang/zh-cn/zh-cn.js"></script>
  304. <script src="/layuiadmin/layui/layui.js"></script>
  305. <script>
  306. layui.config({
  307. base: '/layuiadmin/' //静态资源所在路径
  308. }).extend({
  309. index: 'lib/index' //主入口模块
  310. }).use('index');
  311. </script>
  312. <script>
  313. //由于模块都一次性加载,因此不用执行 layui.use() 来加载对应模块,直接使用即可:
  314. var layer = layui.layer;
  315. var $;
  316. var cur_open_div;
  317. layui.use(['jquery', 'layer', 'form', 'slider'], function () {
  318. $ = layui.$;
  319. var form = layui.form;
  320. var table = layui.table;
  321. })
  322. </script>
  323. <script type="text/javascript">
  324. document.write('<script src="/static/js/diy/szycompontents.js?t="' + Math.random() + '><\/script>');
  325. </script>
  326. <script type="text/javascript">
  327. var diyJson = {$diyJson};
  328. var global = {$global};
  329. var openDiyPage = {$openDiyPage};
  330. if(global) {
  331. global.openDiyPage = openDiyPage;
  332. } else {
  333. global = {openDiyPage: openDiyPage};
  334. }
  335. document.write('<script src="/static/js/diy/szydiy.js?t="' + Math.random() + '><\/script>');
  336. </script>
  337. <!-- 提交begin -->
  338. <script>
  339. $('.all_component_list').on("mousemove",".componnet_list_box ul li",function () {
  340. var icon_selected = $(this).find("img").attr("data-icon-selected");
  341. $(this).find("img").attr("src", icon_selected);
  342. }).on("mouseout",".componnet_list_box ul li",function () {
  343. var icon = $(this).find("img").attr("data-icon");
  344. $(this).find("img").attr("src", icon);
  345. });
  346. var id = 0;
  347. if(diyJson) {
  348. for(var i=0;i<diyJson.length;i++) vue.addSzyComponent(diyJson[i]);
  349. } else {
  350. vue.globalLazyLoad = true;
  351. }
  352. var repeat_flag = false;
  353. $("button.save").click(function(){
  354. // 刷新排序
  355. vue.refreshSort();
  356. setTimeout(function () {
  357. if(vue.submitVerify()){
  358. //全局属性
  359. var global = JSON.stringify(vue.global);
  360. global = eval("("+global+")");
  361. //组件属性
  362. var value = JSON.stringify(vue.data).replace(/\@/g, "");
  363. value = JSON.parse(value);
  364. //重新排序
  365. value.sort(function(a,b){
  366. return a.sort-b.sort;
  367. });
  368. for(var item in value){
  369. delete value[item].verify;
  370. delete value[item].lazyLoad;
  371. delete value[item].lazyLoadCss;
  372. delete value[item].index;
  373. delete value[item].sort;
  374. delete value[item].outerCountJs;
  375. }
  376. var v = {
  377. global : global,
  378. value : value
  379. };
  380. if(repeat_flag) return;
  381. repeat_flag = true;
  382. var data = {
  383. id: id,
  384. name: 'index',
  385. title: vue.global.title,
  386. openDiyPage: vue.global.openDiyPage,
  387. global: JSON.stringify(global).replace(/\'/g, "@"),
  388. value: JSON.stringify(value).replace(/\'/g, "@")
  389. };
  390. var diyurl = "{:U('Shopdiy/save')}";
  391. $.ajax({
  392. url: diyurl,
  393. type: "post",
  394. data: data,
  395. dataType:'json',
  396. success: function (info) {
  397. if(info.status == 0)
  398. {
  399. layer.msg(info.result.message,{icon: 1,time: 2000});
  400. }else if(info.status == 1){
  401. var go_url = location.href;
  402. if( info.result.hasOwnProperty("url") )
  403. {
  404. go_url = info.result.url;
  405. }
  406. layer.msg('操作成功',{time: 1000,
  407. end:function(){
  408. location.href = info.result.url;
  409. }
  410. });
  411. }
  412. }
  413. })
  414. }
  415. },100);
  416. });
  417. </script>
  418. </body>