规范及简化组件写法，拆分插件和组件至不同目录

Author: harsima

src/components/platformCom/pageNotes/main.vue renamed to src/components/AppNotes/index.vue

@@ -1,4 +1,3 @@
-<!-- 引用或解释说明组件 -->
 <template>
     <div class="sys-notes">
         <slot></slot>
@@ -7,6 +6,6 @@
 
 <script>
 export default {
-    name: 'vPageNotes'
+    name: 'AppNotes'
 }
 </script>

src/components/platformCom/pageSearch/main.vue renamed to src/components/AppSearch/index.vue

@@ -6,6 +6,6 @@
 
 <script>
 export default {
-    name: 'vPageSearch'
+    name: 'AppSearch'
 }
 </script>

src/components/platformCom/pageSection/main.vue renamed to src/components/AppSection/index.vue

@@ -9,7 +9,7 @@
 
 <script>
 export default {
-    name: 'vPageSection',
+    name: 'AppSection',
     props: ['title']
 }
 </script>

src/components/platformCom/pageTitle/main.vue renamed to src/components/AppTitle/index.vue

@@ -1,4 +1,3 @@
-<!-- 每个页面的标题，用来重复确认当前所处页面，亦可用作面包屑导航的外层结构。 -->
 <template>
     <div class="sys-title">
         <strong>{{title}}</strong>
@@ -7,7 +6,7 @@
 
 <script>
 export default {
-    name: 'vPageTitle',
+    name: 'AppTitle',
     props: ['title']
 }
 </script>

src/components/platformCom/pageToolbar/main.vue renamed to src/components/AppToolbar/index.vue

@@ -6,7 +6,7 @@
 
 <script>
 export default {
-    name: 'vPageToolbar',
+    name: 'AppToolbar',
     props: {
         align: {
             type: String,

src/components/platformCom/pageTable/main.vue renamed to src/components/TableMixin/index.vue

@@ -22,7 +22,7 @@
 
 <script>
 export default {
-    name: 'vPageTable',
+    name: 'TableMixin',
     props: {
         pagination: Boolean,
         paginationAlign: String,

src/components/customCom/global/install.js

@@ -0,0 +1,26 @@
+// 组件全局注册
+import Vue from 'vue'
+
+import AppNotes from './AppNotes'
+import AppTitle from './AppTitle'
+import AppToolbar from './AppToolbar'
+import AppSection from './AppSection'
+import AppSearch from './AppSearch'
+import TableMixin from './TableMixin'
+
+// 组件库
+const Components = [
+    AppNotes,
+    AppTitle,
+    AppToolbar,
+    AppSection,
+    AppSearch,
+    TableMixin
+]
+
+// 注册全局组件
+Components.map((com) =>{
+    Vue.component(com.name, com)
+})
+
+export default Vue

src/components/install.js

@@ -11,7 +11,8 @@ import axios from './util/ajax'
 import i18n from './util/i18n'
 import App from './index'
 
-import './components/platformCom/install'
+import './components/install'
+import './plugins/install'
 
 // 注册组件到Vue
 Vue.prototype.$axios = axios

src/components/platformCom/install.js

@@ -1,11 +1,11 @@
 <template>
     <div class="sys-page">
-        <v-pageTitle title="引用说明"></v-pageTitle>
+        <app-title title="引用说明"></app-title>
         <div class="page-content">
-            <v-pageNotes>
+            <app-notes>
                 现在看到的就是引用说明组件
-            </v-pageNotes>
-            <v-pageSection title="组件说明">
+            </app-notes>
+            <app-section title="组件说明">
                 <el-table :data="tableData" style="width: 100%">
                     <el-table-column prop="name" label="组件使用">
                     </el-table-column>
@@ -18,7 +18,7 @@
                     <el-table-column prop="paramType" label="参数类型">
                     </el-table-column>
                 </el-table>
-            </v-pagesection>
+            </app-section>
         </div>
     </div>
 </template>
@@ -29,7 +29,7 @@ export default {
         return {
             tableData: [
                 {
-                    name: '<v-pageNotes></v-pageNotes>',
+                    name: '<app-notes></app-notes>',
                     detail: '可以插入任意节点，外层仅为有样式的<div>层',
                     param: '-',
                     paramDetail: '-',

src/components/platformCom/pageNotes/index.js

@@ -1,12 +1,12 @@
 <template>
     <div class="sys-page">
-        <v-pageTitle title="统一分页插件"></v-pageTitle>
+        <app-title title="统一分页插件"></app-title>
         <div class="page-content">
             <div class="article">
                 <p>该组件为ElementUI的分页组件二次封装，以实现统一的分页设置。分页所有方法统一继承自ElementUI</p>
             </div>
-            <v-pageTable pagination></v-pageTable>
-            <v-pageSection title="函数说明">
+            <table-mixin pagination></table-mixin>
+            <app-section title="函数说明">
                 <el-table :data="tableData" style="width: 100%">
                     <el-table-column prop="name" label="组件使用">
                     </el-table-column>
@@ -19,7 +19,7 @@
                     <el-table-column prop="paramType" label="参数类型">
                     </el-table-column>
                 </el-table>
-            </v-pagesection>
+            </app-section>
         </div>
     </div>
 </template>
@@ -30,7 +30,7 @@ export default {
         return {
             tableData: [
                 {
-                    name: '<v-pageTable></v-pageTable>',
+                    name: '<table-mixin></table-mixin>',
                     detail: '统一table',
                     param: 'pagination',
                     paramDetail: '是否有分页',

src/components/platformCom/pageSearch/index.js

@@ -1,12 +1,12 @@
 <template>
     <div class="sys-page">
-        <v-pageTitle title="详细鉴权组件"></v-pageTitle>
+        <app-title title="详细鉴权组件"></app-title>
         <div class="page-content">
             <div class="sys-article">
                 <p>该组件并非鉴别页面访问权限，实际是鉴别页面内部某些按钮或操作的权限。</p>
                 <p>页面中的某些操作或者某些区块拥有访问等其他权限时，只需要添加<code>v-hasPermission="'view'"</code>即可。</p>
             </div>
-            <v-pageSection title="函数说明">
+            <app-section title="函数说明">
                 <el-table :data="tableData" style="width: 100%">
                     <el-table-column prop="name" label="指令名">
                     </el-table-column>
@@ -15,7 +15,7 @@
                     <el-table-column prop="type" label="参数类型">
                     </el-table-column>
                 </el-table>
-            </v-pagesection>
+            </app-section>
         </div>
     </div>
 </template>

src/components/platformCom/pageSection/index.js

@@ -1,11 +1,11 @@
 <template>
     <div class="sys-page" v-once>
-        <v-pageTitle title="介绍"></v-pageTitle>
+        <app-title title="介绍"></app-title>
         <div class="page-content">
-            <v-pageNotes>
+            <app-notes>
                 该部分组件为本系统自行开发的组件（包括对第三方组件的封装），不包括纯粹的第三方组件。系统组件仅为通用的大众化组件，需注意和项目组件进行区分。全部系统组件文件位于 src/components/platformCom 
-            </v-pageNotes>
-            <v-pageSection title="使用方法">
+            </app-notes>
+            <app-section title="使用方法">
                 <div class="sys-article">
                     <p>系统组件默认使用全局注册，无需再次引入。如果需要按需引入，只需在<code>src/main.js</code>中取消对全局组件的引入即可。如下所示</p>
                     <pre v-pre class="sys-pre"><code>
@@ -18,15 +18,15 @@
                     </code></pre>
                     <p>如果需要取消部分全局组件的应用，则修改<code>src/components/platformCom/install.js</code>的引入组件即可</p>
                 </div>
-            </v-pageSection>
-            <v-pageSection title="分类说明">
+            </app-section>
+            <app-section title="分类说明">
                 <div class="sys-article">
                     <p>系统组件主要分为三大类</p>
                     <p>功能类：以实现具体功能为主，包括对第三方组件的二次封装类，尽量不要修改。</p>
                     <p>布局类：以常用布局为主，包括标题、间距、搜索之类的纯布局组件，可按实际项目要求修改</p>
                     <p>辅助类：文档辅助说明及其他组件部分，可能不会应用在正式产品中，该类别可以不引入到正式产品中</p>
                 </div>
-            </v-pageSection>
+            </app-section>
         </div>
     </div>
 </template>

src/components/platformCom/pageTable/index.js

@@ -1,11 +1,11 @@
 <template>
     <div class="sys-page">
-        <v-pageTitle title="搜索条"></v-pageTitle>
+        <app-title title="搜索条"></app-title>
         <div class="page-content">
-            <v-pageSearch>
+            <app-search>
                 现在看到的就是搜索条
-            </v-pageSearch>
-            <v-pageSection title="组件说明">
+            </app-search>
+            <app-section title="组件说明">
                 <el-table :data="tableData" style="width: 100%">
                     <el-table-column prop="name" label="组件使用">
                     </el-table-column>
@@ -18,7 +18,7 @@
                     <el-table-column prop="paramType" label="参数类型">
                     </el-table-column>
                 </el-table>
-            </v-pagesection>
+            </app-section>
         </div>
     </div>
 </template>
@@ -29,7 +29,7 @@ export default {
         return {
             tableData: [
                 {
-                    name: '<v-pageSearch></v-pageSearch>',
+                    name: '<app-search></app-search>',
                     detail: '可以插入任意节点，外层仅为有样式的<div>层',
                     param: '-',
                     paramDetail: '-',

src/components/platformCom/pageTitle/index.js

@@ -1,11 +1,11 @@
 <template>
     <div class="sys-page">
-        <v-pageTitle title="子区域"></v-pageTitle>
+        <app-title title="子区域"></app-title>
         <div class="page-content">
-            <v-pageSection title="子区域标题">
+            <app-section title="子区域标题">
                 子区域任意内容
-            </v-pageSection>
-            <v-pageSection title="组件说明">
+            </app-section>
+            <app-section title="组件说明">
                 <el-table :data="tableData" style="width: 100%">
                     <el-table-column prop="name" label="组件使用">
                     </el-table-column>
@@ -18,7 +18,7 @@
                     <el-table-column prop="paramType" label="参数类型">
                     </el-table-column>
                 </el-table>
-            </v-pagesection>
+            </app-section>
         </div>
     </div>
 </template>
@@ -29,7 +29,7 @@ export default {
         return {
             tableData: [
                 {
-                    name: '<v-pageSection></v-pageSection>',
+                    name: '<app-section></app-section>',
                     detail: '该区域为详细区域分块',
                     param: 'title',
                     paramDetail: '定义分块标题',