Jelajahi Sumber

feat: 隐藏菜单/开发编辑器页面10%

王家程 3 tahun lalu
induk
melakukan
e879ee9c5d

TEMPAT SAMPAH
src/assets/wc.png


+ 3 - 2
src/components/generator/table.js

@@ -2,14 +2,15 @@
  * @Author: WangJiaCheng
  * @Date: 2021-07-26 14:27:27
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-07-30 10:50:13
+ * @LastEditTime: 2021-08-20 14:12:11
  * @Description: table生成
  */
 import { exportDefault, titleCase, deepClone } from '@/utils/index'
 
 export function buildTable(formData) {
   const { list = [] } = formData
-  const child = list.map(item => `<el-table-column prop="${item.field}" label="${item.name}"></el-table-column>`).join('\n')
+  const child = list.map(item => `<el-table-column prop="${item.field}" label="${item.name}"></el-table-column>`)
+    .join('\n')
   const str = `<w-table
     v-loading="loading"
     :data="tableData"

+ 12 - 0
src/icons/svg/element-icon.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="30px" height="30px" viewBox="0 0 38 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch -->
+    <title>Shape Copy</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="v2.2.0" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页-默认效果-copy-2" transform="translate(-70.000000, -19.000000)" fill="#409EFF">
+            <path d="M212.135441,45.1578077 Z M103.416502,46.2175511 C103.407008,47.7945682 102.587841,48.1463474 102.587841,48.1463474 C102.587841,48.1463474 88.4520478,56.3145087 87.5329956,56.8262751 C86.622336,57.2171561 86.0136703,56.8262751 86.0136703,56.8262751 C86.0136703,56.8262751 71.2225706,48.2479572 70.6826962,47.8708444 C70.1426843,47.4937316 70.1301643,46.9063774 70.1301643,46.9063774 C70.1301643,46.9063774 70.1450232,29.9199174 70.1301643,29.1333364 C70.1153053,28.3466177 71.0969576,27.7555461 71.0969576,27.7555461 L85.8755373,19.2134387 C86.7853714,18.7332016 87.6711286,19.2134387 87.6711286,19.2134387 C87.6711286,19.2134387 100.726623,26.8020937 102.173442,27.6177257 C103.591507,28.2919577 103.416502,29.6843424 103.416502,29.6843424 C103.416502,29.6843424 103.425307,44.7519192 103.416502,46.2175511 L103.416502,46.2175511 Z M97.5160105,29.1691339 C94.4900173,27.4274483 87.3615842,23.2971063 87.3615842,23.2971063 C87.3615842,23.2971063 86.6661039,22.9212326 85.9517747,23.2971063 L74.3487406,29.98215 C74.3487406,29.98215 73.5780025,30.4449014 73.589697,31.0604805 C73.6013915,31.6760597 73.589697,44.9698708 73.589697,44.9698708 C73.589697,44.9698708 73.5994654,45.4295932 74.0234951,45.7246472 C74.4473873,46.0197011 86.0601898,52.7332451 86.0601898,52.7332451 C86.0601898,52.7332451 86.538152,53.0391759 87.2530315,52.7332451 C87.9746526,52.3327262 99.0730335,45.9402582 99.0730335,45.9402582 C99.0730335,45.9402582 99.7162325,45.6648929 99.7236619,44.4307056 C99.7257257,44.0747959 99.7265512,42.6932881 99.7266887,40.9575229 L86.6600502,48.8752394 L86.6600502,45.846221 C86.6600502,44.6021205 87.6231289,43.7809811 87.6231289,43.7809811 L99.1807607,36.8165793 C99.6168978,36.3611251 99.7068768,35.6315447 99.7254505,35.3556287 C99.7250378,34.0904627 99.7244874,32.9852841 99.7240747,32.2851678 L86.6600502,40.2012321 L86.6600502,37.034531 C86.6600502,35.7904305 87.4855462,35.2446564 87.4855462,35.2446564 L97.5160105,29.1691339 Z" id="Shape-Copy"></path>
+        </g>
+    </g>
+</svg>

+ 5 - 2
src/layouts/DefaultLayout/DefaultSide/SideItem.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-07 16:07:56
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-08-19 17:24:32
+ * @LastEditTime: 2021-08-20 14:13:28
  * @Description:
 -->
 <template>
@@ -69,7 +69,10 @@ export default {
       type: Boolean,
       default: true
     },
-    basePath: String,
+    basePath: {
+      type: String,
+      default: '/'
+    },
     isFirstLevel: {
       type: Boolean,
       default: true

+ 4 - 1
src/layouts/DefaultLayout/DefaultSide/SideItemLink.vue

@@ -10,7 +10,10 @@
 export default {
   name: 'SideItemLink',
   props: {
-    to: String
+    to: {
+      type: String,
+      default: '/'
+    }
   }
 }
 </script>

+ 2 - 2
src/layouts/DefaultLayout/index.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-06 17:24:30
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-08-19 16:58:01
+ * @LastEditTime: 2021-08-20 15:36:08
  * @Description:
 -->
 <template>
@@ -10,7 +10,7 @@
     <el-container class="is-vertical">
       <default-header />
       <el-main class="layout-main">
-        <default-side />
+        <!-- <default-side /> -->
         <div style="width: 100%">
           <keep-alive>
             <router-view :key="$route.fullPath" />

+ 2 - 0
src/router/index.js

@@ -7,6 +7,7 @@ import page from './modules/page'
 import form from './modules/form'
 import template from './modules/template'
 import list from './modules/list'
+import editor from './modules/editor'
 
 // 全局处理路由导航重复
 const originalPush = VueRouter.prototype.push
@@ -39,6 +40,7 @@ export const routes = [
   ...template,
   ...form,
   ...list,
+  ...editor,
   {
     path: '/tinymce',
     name: 'tinymce',

+ 39 - 0
src/router/modules/editor.js

@@ -0,0 +1,39 @@
+/*
+ * @Author: WangJiaCheng
+ * @Date: 2021-08-20 14:24:33
+ * @LastEditors: WangJiaCheng
+ * @LastEditTime: 2021-08-20 15:38:09
+ * @Description: 编辑器
+ */
+import DefaultLayout from '@/layouts/DefaultLayout/index.vue'
+
+const editor = [
+  {
+    path: '/app',
+    component: DefaultLayout,
+    redirect: '/app/list',
+    meta: {
+      title: '应用编辑'
+    },
+    children: [
+      {
+        path: 'list',
+        name: 'appList',
+        meta: {
+          title: '列表'
+        },
+        component: () => import('@/views/Template/List/index.vue')
+      },
+      {
+        path: 'editor',
+        name: 'appEditor',
+        meta: {
+          title: '列表'
+        },
+        component: () => import('@/views/app/editor/index.vue')
+      }
+    ]
+  }
+]
+
+export default editor

+ 2 - 2
src/router/modules/form.js

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-10 16:31:41
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-05-10 16:38:49
+ * @LastEditTime: 2021-08-20 14:15:59
  * @Description:
  */
 import DefaultLayout from '@/layouts/DefaultLayout/index.vue'
@@ -11,7 +11,7 @@ const form = [
   {
     path: '/form',
     component: DefaultLayout,
-    redirect: '/design',
+    redirect: '/form/design',
     meta: {
       title: '表单管理'
     },

+ 2 - 2
src/router/modules/list.js

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-10 16:30:59
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-05-10 16:38:07
+ * @LastEditTime: 2021-08-20 14:16:06
  * @Description:
  */
 import DefaultLayout from '@/layouts/DefaultLayout/index.vue'
@@ -11,7 +11,7 @@ const list = [
   {
     path: '/list',
     component: DefaultLayout,
-    redirect: '/design',
+    redirect: '/list/design',
     meta: {
       title: '列表管理'
     },

+ 2 - 2
src/router/modules/template.js

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-10 16:30:19
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-05-10 16:37:37
+ * @LastEditTime: 2021-08-20 14:16:38
  * @Description:
  */
 import DefaultLayout from '@/layouts/DefaultLayout/index.vue'
@@ -11,7 +11,7 @@ const template = [
   {
     path: '/template',
     component: DefaultLayout,
-    redirect: '/list',
+    redirect: '/template/list',
     meta: {
       title: '模板管理'
     },

+ 7 - 3
src/views/Page/Edit/FormConfig.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-11 17:37:33
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-07-27 17:21:19
+ * @LastEditTime: 2021-08-20 14:14:34
  * @Description: 表单配置
 -->
 <template>
@@ -32,8 +32,12 @@
         <el-input v-model="formData.searchApi" />
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" @click="next">下一步</el-button>
-        <el-button type="primary" @click="previewCode">预览代码</el-button>
+        <el-button type="primary" @click="next">
+          下一步
+        </el-button>
+        <el-button type="primary" @click="previewCode">
+          预览代码
+        </el-button>
       </el-form-item>
     </el-form>
   </div>

+ 2 - 2
src/views/Page/Edit/index.vue

@@ -2,13 +2,13 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-10 17:25:15
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-07-30 11:27:03
+ * @LastEditTime: 2021-08-20 15:39:14
  * @Description:
 -->
 <template>
   <div>
     <headers
-      title="页面编辑"
+      title="代码生成"
     />
     <main-content>
       <el-tabs :value="activeTab" @tab-click="handleClick">

+ 72 - 0
src/views/app/editor/index.vue

@@ -0,0 +1,72 @@
+<!--
+ * @Author: WangJiaCheng
+ * @Date: 2021-08-20 09:10:36
+ * @LastEditors: WangJiaCheng
+ * @LastEditTime: 2021-08-20 18:12:06
+ * @Description: 编辑器
+-->
+<template>
+  <div class="editor-container">
+    <div class="editor-menu">
+      <el-tabs
+        tab-position="left"
+        style="width: 400px;height: 100%;"
+      >
+        <el-tab-pane>
+          <span slot="label">
+            <img :src="wcIconImg" alt="wc" style="width: 24px;">
+          </span>
+          WisdomUI
+        </el-tab-pane>
+        <el-tab-pane>
+          <span slot="label">
+            <svg-icon icon-class="element-icon" style="font-size: 24px;" />
+          </span>
+          ElemenUI
+        </el-tab-pane>
+        <el-tab-pane>
+          <span slot="label">
+            <svg-icon icon-class="component" style="font-size: 24px;" />
+          </span>
+          自定义
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+    <div class="editor-main">
+      编辑区
+    </div>
+    <div class="editor-prop">
+      属性
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  inputComponents, selectComponents, layoutComponents, formConf
+} from '@/components/generator/config'
+import wcIcon from '@/assets/wc.png'
+
+export default {
+  name: 'Editor',
+  data() {
+    return {}
+  },
+  computed: {
+    wcIconImg() {
+      return wcIcon
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .editor-container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    .editor-menu {
+      height: 100%;
+    }
+  }
+</style>

+ 16 - 1
src/views/dashboard/index.vue

@@ -2,7 +2,7 @@
  * @Author: WangJiaCheng
  * @Date: 2021-05-07 12:09:58
  * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-08-20 10:38:59
+ * @LastEditTime: 2021-08-20 17:58:46
  * @Description:
 -->
 <template>
@@ -11,6 +11,7 @@
       <div class="entry-row">
         <div
           class="entry-item"
+          @click="goEditor"
         >
           <span>开发页面</span>
         </div>
@@ -22,6 +23,9 @@
         <div :span="12" class="entry-item" @click="handleCreate('page')">
           代码生成
         </div>
+        <div :span="12" class="entry-item" @click="goFormDesign">
+          表单设计
+        </div>
       </div>
     </div>
   </div>
@@ -34,6 +38,17 @@ export default {
     return {}
   },
   methods: {
+    goEditor(type) {
+      this.$router.push({
+        name: 'appEditor',
+        query: { id: 'create' }
+      })
+    },
+    goFormDesign() {
+      this.$router.push({
+        name: 'formDesign'
+      })
+    },
     handleCreate(type) {
       this.$router.push({
         name: `${type}Edit`,

+ 0 - 7
src/views/editor/index.vue

@@ -1,7 +0,0 @@
-<!--
- * @Author: WangJiaCheng
- * @Date: 2021-08-20 09:10:36
- * @LastEditors: WangJiaCheng
- * @LastEditTime: 2021-08-20 09:10:37
- * @Description: 编辑器
--->

+ 1 - 1
vue.config.js

@@ -46,7 +46,7 @@ module.exports = {
   devServer: {
     overlay: {
       // 错误信息显示到浏览器上
-      warnings: true,
+      warnings: false,
       errors: true
     }
   },