0.0.52

0.0.52

src/layout/components/template/componentMenu.vue

@@ -1,33 +1,47 @@
 <template>
   <div class="componentMenuBox" id="componentMenuBox">
     <div class="componentMenuTitle">
-      <div v-if="type == 'sector'">可选板块：</div>
-      <div v-if="type == 'component'">可选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 1">首页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 1">首页可选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 2">分类页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 2">分类页选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 3">列表页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 3">列表页选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 4">详情页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 4">详情页选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 5">搜索页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 5">搜索页选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 6">自定义列表页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 6">自定义列表页选组件：</div>
+      <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 7">自定义详情页可选板块：</div>
+      <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 7">自定义详情页选组件：</div>
     </div>
-    <div v-if="type == 'sector'">
+    <div>
       <el-scrollbar wrap-class="scrollbar-wrapper">
-        <style1Sector/>
+        <!--首页板块-->
+        <div v-if="this.$store.state.template.menuType == 1 && this.$store.state.template.pageStatus == 1">
+          <indexSector/>
+        </div>
+        <!--首页组件-->
+        <div v-if="this.$store.state.template.menuType == 2 && this.$store.state.template.pageStatus == 1">
+          
+        </div>
       </el-scrollbar>
     </div>
-    <!-- <div v-if="type == 'component'" class="componentBox">
-      组件
-    </div> -->
   </div>
 </template>
 
 <script>
-//style1
-import style1Sector from './style/1/sector.vue';
+//首页板块
+import indexSector from './pages/index/sector.vue';
+
 export default {
   name: 'componentMenu',
   components:{
-    style1Sector
+    indexSector
   },
   props: {
-    type: {
-      type: String, //sector component
-      required: true
-    },
+    
   },
   data() {
     return {
@@ -35,14 +49,7 @@ export default {
     }
   },
   methods: {
-    addModule(type,h){
-      let data = {
-        type: type,
-        h: h
-      }
-      console.log(data);
-      this.$store.commit('template/addModule',data);
-    }
+    
   }
 }
 </script>
@@ -75,31 +82,5 @@ export default {
         padding-left: 25px;
       }
     }
-    .sectorItemBox {
-      box-sizing: border-box;
-      padding: 0 20px 40px 20px;
-      height: 130px;
-      cursor: pointer;
-      .sectorItem {
-        border: 1px solid #333644;
-        padding: 10px;
-        border-radius: 8px;
-        &:hover {
-          background: #333644;
-          transform: scale(1.1);
-          transition: all 0.2s ease-in-out;
-        }
-        img {
-          display: block;
-          width: 100%;
-        }
-      }
-      .sectorItemTitle {
-        color: #fff;
-        font-size: 14px;
-        padding: 10px 0 0 0;
-        text-align: center;
-      }
-    }
   }
 </style>

src/layout/creatWebsite.vue

@@ -1,7 +1,7 @@
 <template>
   <div :class="classObj" class="app-wrapper">
     <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
-    <componentMenu :type="this.$store.state.template.menuType"/>
+    <componentMenu />
     <div :class="{hasTagsView:needTagsView}" class="main-container">
       <div :class="{'fixed-header':fixedHeader}">
         <navbar />

src/store/modules/template.js

@@ -3,20 +3,20 @@ import {getSiteInfo,getSiteCategory,selectWebsiteDepartment,selectWebsiteArea,ge
 
 const state = {
   //0.全局配置 start------------------------------------------------------------> 
-  editWebsiteId: "",//创建网站的id
-  stepStatus: true,//true显示步骤 false不显示
-  menuType: "sector", //sector板块 component组件
+  editWebsiteId: "",//当前编辑网站的id
+  stepStatus: true,//是否显示现在进行到哪一步：true=显示 false=不显示
   //0.全局配置 end------------------------------------------------------------>
   //1.页面数据 start------------------------------------------------------------>
-  pageStatus:1,//当前编辑哪个页面 1 首页 2 分类页 3 列表页 4 详情页 5 搜索页 6 自定义列表页 7 自定义详情页
-  pageData: {
+  pageStatus:1,//当前编辑哪个页面  1=首页 2=分类页 3=列表页 4=详情页 5=搜索页 6=自定义列表页 7=自定义详情页 
+  menuType:1, //当前菜单显示板块还是组件 1=板块 2=组件 
+  pageData: { //准备提交到后台的数据
     index:[],//首页
-    category:[],//分类页
+    class:[],//分类页
     list:[],//列表页
-    detail:[],//详情页
+    article:[],//详情页
     search:[],//搜索页
-    customList:[],//自定义列表页
-    customDetail:[],//自定义详情页
+    aloneList:[],//自定义列表页
+    aloneArticle:[],//自定义详情页
   },
   // layout: [
   //   // i = id 

src/views/template/page/pageIndex.vue

@@ -3,10 +3,10 @@
     <grid-layout :layout="this.$store.state.template.pageData.index" :margin="[0,0]" :col-num="12" :row-height="rowHeight" :is-draggable="true" :is-resizable="true">
       <grid-item v-for="(item, index) in this.$store.state.template.pageData.index" :key="item.i" :i="item.i" :x="item.x" :y="item.y" :w="item.w" :h="item.h" :is-resizable="false">
         <div class="grid-item-content">
-          <div class="abc"></div>
+          <div class="grid-tools-menu">编辑</div>
           <!-- 页头板块 -->
           <div v-if="item.type == 'headSector'" class="moduleBox">
-              <headSector />
+            <headSector />
           </div>
           <!-- 导航板块 --> 
           <div v-if="item.type == 'menuSector'" class="moduleBox">
@@ -155,6 +155,13 @@ export default {
     background-color: #fff;
     height: 100%;
     overflow: hidden;
+    position: relative;
+    .grid-tools-menu {
+      position: absolute;
+      top: 0;
+      right: 0;
+      z-index: 99;
+    }
   }
   .grid-layout {
     grid-gap: 0;