Update: 增加PC端装修

leo
Commit 09f6d644c0492e154c5fc03bf428625445488906 1 parent c5d12877
Showing 5 changed files with 83 additions and 41 deletions
code/apps/shop/views/modular/Decorator.html
code/apps/shop/views/modular/templates/pc-template.html
code/static/js.jquery/module/shop/modular/Decorator.js
code/static/sass/module/decorator-modular.css
code/static/sass/module/pc-modular.css
--- a/code/apps/shop/views/modular/Decorator.html
View file @09f6d64
+++ b/code/apps/shop/views/modular/Decorator.html
View file @09f6d64
@@ -47,7 +47,7 @@
         <!-- 右侧装修内容 -->
         <div class="decorator-right">
-            <div class="main-decorator"></div>
+            <!--<div class="main-decorator"></div>-->
         </div>
     </div>
--- a/code/apps/shop/views/modular/templates/pc-template.html
View file @09f6d64
+++ b/code/apps/shop/views/modular/templates/pc-template.html
View file @09f6d64
 <!-- PC模板渲染 -->
 <script type="text/template" id="pc-template">
-    <div class="pc-template">
-        <!-- 1150区域 -->
-        [[each data[0] as item index]]
-        <!-- 店招 -->
-        [[if item.moduleType == 'ShopBanner']]
-            [[if item.moduleData]]
-            [[else]]
-            <div class="pc-shop-banner modular-editor">
-                <img src="/static/assets/images/decorator/yoho-logo.png" alt="#" class="logo">
-            </div>
+    <div class="pc-template-area">
+        <div class="pc-template">
+            <!-- 1150区域 -->
+            [[each data[0] as item index]]
+            <!-- 店招 -->
+            [[if item.moduleType == 'ShopBanner']]
+                [[if item.moduleData]]
+                [[else]]
+                <div class="modular-editor pc-shop-banner">
+                    <img src="/static/assets/images/decorator/yoho-logo.png" alt="#" class="logo">
+                </div>
+                [[/if]]
             [[/if]]
-        [[/if]]
-        <!-- 导航 -->
-        [[if item.moduleType == 'ShopNavbar']]
-            [[if item.moduleData]]
-            [[else]]
-            <div class="pc-shop-navbar modular-editor"></div>
+            <!-- 导航 -->
+            [[if item.moduleType == 'ShopNavbar']]
+                [[if item.moduleData]]
+                [[else]]
+                <div class="pc-shop-navbar modular-editor">
+                    <ul>
+                        <li><a href="javascript:;">店铺首页</a></li>
+                        <li><a href="javascript:;">全部商品</a></li>
+                        <li><a href="javascript:;">人气单品</a></li>
+                        <li><a href="javascript:;">新品上架</a></li>
+                    </ul>
+                </div>
+                [[/if]]
             [[/if]]
-        [[/if]]
-        [[/each]]
+            [[/each]]
-        <div>
-            <!-- 160区域 -->
-            <div class="left-area">
-                [[each data[1] as item index]]
-                [[/each]]
-            </div>
+            <div>
+                <!-- 160区域 -->
+                <div class="left-area">
+                    [[each data[1] as item index]]
+                    [[/each]]
+                </div>
-            <!-- 975区域 -->
-            <div class="right-area">
-                [[each data[2] as item index]]
-                [[/each]]
+                <!-- 975区域 -->
+                <div class="right-area">
+                    [[each data[2] as item index]]
+                    [[/each]]
+                </div>
             </div>
         </div>
     </div>
--- a/code/static/js.jquery/module/shop/modular/Decorator.js
View file @09f6d64
+++ b/code/static/js.jquery/module/shop/modular/Decorator.js
View file @09f6d64
@@ -217,11 +217,13 @@ var Bll = {
     },
     renderDecoratorPCTemplate: function() {
-        $('.main-decorator').html(common.util.__template2($('#pc-template').html(), {data: defaultPCModuleData}));
+        // $('.main-decorator').html(common.util.__template2($('#pc-template').html(), {data: defaultPCModuleData}));
+        $('.decorator-right').html(common.util.__template2($('#pc-template').html(), {data: defaultPCModuleData}));
     },
     renderDecoratorAppTemplate: function() {
-        $('.main-decorator').html(common.util.__template2($('#app-template').html(), {data: Bll.moduleDataList}));
+        // $('.main-decorator').html(common.util.__template2($('#app-template').html(), {data: Bll.moduleDataList}));
+        $('.decorator-right').html(common.util.__template2($('#app-template').html(), {data: Bll.moduleDataList}));
     },
     // 模块增加编辑图标
@@ -545,6 +547,9 @@ var Bll = {
                 Bll.moduleGrid.init(Bll.moduleGrid.__rows);
                 break;
         };
+
+        var e = new common.edit('.editorTitle',{bucket:"yhb-img02"});
+        e.init();
     },
     // 设置当前模块与下个模块间的间隔，对于"店招"模块不涉及，没有间距
@@ -555,9 +560,6 @@ var Bll = {
         }
         $('.editorTitle').append(common.util.__template2($('#module-margin-template').html(), {isModuleMargin: Bll.getModuleMargin(module)}));
-
-        var e = new common.edit('.editorTitle',{bucket:"yhb-img02"});
-        e.init();
     },
     // 获取是否设置模块间间距，默认是1
@@ -1194,6 +1196,7 @@ var publishDecoratorTemplate = function() {
     var curTemplate = $('.selected-template').parent();
     var templateId = $(curTemplate).data('id');
     var isSystemTemplate = $(curTemplate).data('is-system-template');
+    var index = $(curTemplate).data('index');
     if(isSystemTemplate && +isSystemTemplate == 1) {
         common.util.__tip('系统模板无法发布，请编辑存储为备份模板后，再发布!', 'warning');
@@ -1205,6 +1208,10 @@ var publishDecoratorTemplate = function() {
         data: {
             templateId: templateId
         }
+    }, function(res) {
+        // 发布模板之后，模板状态变更，重载模板列表
+        Bll.getTemplates();
+        Bll.renderTemplateList(index);
     });
 };
--- a/code/static/sass/module/decorator-modular.css
View file @09f6d64
+++ b/code/static/sass/module/decorator-modular.css
View file @09f6d64
@@ -209,7 +209,7 @@
 .decorator-template .template-del-icon {
     position: absolute;
     margin-top: -108px;
-    margin-left: 18px;
+    margin-left: 20px;
     z-index: 21;
     width: 20px;
     height: 20px;
@@ -221,6 +221,7 @@
     top: 60px;
     left: 200px;
     bottom: 0;
+    overflow: hidden;
 }
 .app-template {
@@ -234,13 +235,13 @@
 }
 .pc-template {
-    margin-top: 38px;
+    /*margin-top: 38px;*/
     width: 1150px;
     overflow-y: auto;
-    height: 800px;
+    height: 1800px;
     background: #F0F0F0;
     border: 1px dashed;
-    box-shadow: 0px 0px 15px rgba(0,0,0,.8);
+    /*box-shadow: 0px 0px 15px rgba(0,0,0,.8);*/
 }
 /* 适配笔记本电脑 */
--- a/code/static/sass/module/pc-modular.css
View file @09f6d64
+++ b/code/static/sass/module/pc-modular.css
View file @09f6d64
+.pc-template-area {
+    margin-top: 38px;
+    height: 100%;
+    overflow-y: auto;
+}
+
 .pc-template .pc-shop-banner {
     height: 150px;
     margin-bottom: 0;
     text-align: center;
 }
+.pc-shop-banner .logo {
+    top: 66px !important;
+}
+
+
 .pc-template .pc-shop-navbar {
     height: 40px;
     margin-bottom: 30px;
-    background: url(/static/assets/images/decorator/pc-shop-navbar.png);
+    background: #000000;
 }
-.pc-shop-banner .logo {
-    top: 66px !important;
+.pc-shop-navbar ul {
+    list-style: none;
+    margin: 0;
+}
+
+.pc-shop-navbar ul li {
+    float: left;
+    width: 14%;
+    line-height: 40px;
+    padding: 0 20px;
+    font-size: 16px;
+    font-family: microsoft yahei;
+}
+
+.pc-shop-navbar ul li a {
+    color: #FFFFFF;
 }
 .pc-template .left-area {