update template

Author: BingBlog

generator/template/src/__mock__/app/menu-list.json

@@ -4,10 +4,6 @@
  {
  "label": "Home",
  "path": "/home"
- },
- {
- "label": "Data Report",
- "path": "/data-report"
  }
  ]
 }

generator/template/src/__mock__/home/home-data.json

@@ -0,0 +1,23 @@
+{
+ "status": 0,
+ "data": {
+ "carouselData": [
+ "Welcome to Configurable Platform",
+ "Power and Fasten Platform Developing"
+ ],
+ "hotTemplates": [
+ {
+ "title": "Data Report",
+ "description": "A comfigurable data report template, support searching and data visualization!"
+ },
+ {
+ "title": "Authority Management",
+ "description": "A comfigurable authority management template, based on BRAC model"
+ },
+ {
+ "title": "Editable Table",
+ "description": "Modify data inside the table, really convenient!"
+ }
+ ]
+ }
+}

generator/template/src/libs/utils.js

@@ -1,5 +1,4 @@
 export function computeBreadCrumbList(currentPath = "", menuList = []) {
- console.log(currentPath, menuList);
  let breadCrumbList = [];
  menuList.forEach(item => {
  if (item.submenu) {

generator/template/src/main.js

@@ -1,21 +1,21 @@
 import Vue from "vue";
 import iView from "iview";
 import VueRouter from "vue-router";
-import FormGenerator from "form-generator-iview/src/index";
-import DataVis from "data-vis-iview";
+// import FormGenerator from "form-generator-iview/src/index";
+// import DataVis from "data-vis-iview";
 
 import App from "./App.vue";
 import router from "./router";
 import store from "./store";
 
 import "iview/dist/styles/iview.css";
-import "form-generator-iview/src/style/index.less";
-import "data-vis-iview/src/style/index.less";
+// import "form-generator-iview/src/style/index.less";
+// import "data-vis-iview/src/style/index.less";
 
 Vue.use(VueRouter);
 Vue.use(iView);
-Vue.use(FormGenerator);
-Vue.use(DataVis);
+// Vue.use(FormGenerator);
+// Vue.use(DataVis);
 
 // 开启debug模式
 Vue.config.debug = true;

generator/template/src/page/home/index.vue

@@ -1,3 +1,77 @@
 <template>
- <div>Home</div>
+ <div class="page-home">
+ <Carousel v-model="current" loop>
+ <CarouselItem v-for="(item, index) in carouselData" :key="index">
+ <div class="page-home-carousel-content">{{ item }}</div>
+ </CarouselItem>
+ </Carousel>
+ <div class="page-home-hot-templates">
+ <h1 class="page-home-hot-templates-header">Hot Templates</h1>
+ <div class="page-home-hot-templates-cards">
+ <Card
+ v-for="(item, index) in hotTemplates"
+ :key="index"
+ class="page-home-hot-templates-card"
+ >
+ <p slot="title">{{ item.title }}</p>
+ <p>
+ {{ item.description }}
+ </p>
+ </Card>
+ </div>
+ </div>
+ </div>
 </template>
+<script>
+import service from "@/service";
+export default {
+ data() {
+ return {
+ current: 0,
+ carouselData: [],
+ hotTemplates: []
+ };
+ },
+ mounted() {
+ service.getHomeData().then(res => {
+ console.log();
+ const { carouselData, hotTemplates } = res.data;
+ this.carouselData = carouselData;
+ this.hotTemplates = hotTemplates;
+ });
+ }
+};
+</script>
+<style lang="less">
+.page-home {
+ &-carousel-content {
+ border-radius: 4px;
+ height: 300px;
+ font-size: 24px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: #506b9e;
+ color: #fff;
+ }
+
+ &-hot-templates {
+ margin-top: 30px;
+ &-header {
+ text-align: center;
+ }
+
+ &-cards {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ }
+ &-card {
+ width: 30%;
+ display: inline-block;
+ margin: 20px;
+ height: 120px;
+ }
+ }
+}
+</style>

generator/template/src/page/home/router.js

@@ -0,0 +1,4 @@
+export default {
+ path: "/home",
+ component: () => import(/* webpackChunkName: "home" */ "./index")
+};

generator/template/src/page/home/service.js

@@ -0,0 +1,11 @@
+const getHomeData = (params = {}) => {
+ return {
+ url: "/api/home/home-data",
+ method: "get",
+ params
+ };
+};
+
+export default {
+ getHomeData
+};

generator/template/src/router/routers.js

@@ -4,19 +4,18 @@
  */
 
 import Main from "../components/layout/default";
-import dataReportRouter from "../page/data-report/router";
+
+const routersContext = require.context("../page/", true, /router\.js$/);
+const routers = routersContext.keys().map(key => {
+ return routersContext(key).default;
+});
+
 export default [
  {
  path: "/",
  redirect: "/home",
  component: Main,
- children: [
- {
- path: "/home",
- component: () => import(/* webpackChunkName: "home" */ "../page/home")
- },
- ...dataReportRouter
- ]
+ children: [...routers]
  }
  // {
  // path: '/401',

generator/template/src/service/index.js

@@ -1,17 +1,27 @@
 import axios from "../libs/api.request";
 
-import * as appServices from "./module/app";
-import * as userServices from "./module/user";
+import appServices from "./module/app";
+import userServices from "./module/user";
 
-import * as dataReportServices from "../page/data-report/service";
+const templateServiceContext = require.context("../page", true, /service\.js$/);
+const templateServices = {};
+
+templateServiceContext.keys().map(key => {
+ const contextObj = templateServiceContext(key).default;
+ Object.keys(contextObj).forEach(service => {
+ templateServices[service] = contextObj[service];
+ });
+});
 
 const servicesConfig = {
  ...appServices,
  ...userServices,
- ...dataReportServices
+ ...templateServices
 };
 
+console.log(servicesConfig);
 let services = {};
+
 Object.keys(servicesConfig).forEach(service => {
  services[service] = (params = {}) => {
  return axios.request(servicesConfig[service](params));

generator/template/src/service/module/app.js

@@ -1,7 +1,11 @@
-export const getMenuList = (params = {}) => {
+const getMenuList = (params = {}) => {
  return {
  url: "/api/app/menu-list",
  method: "get",
  params
  };
 };
+
+export default {
+ getMenuList
+};