.

root/api/db.js

@@ -3,8 +3,8 @@ const db = {
         console.log(dbAccount)
         return red.postX('/_db/catalog_list', {dbAccount: JSON.stringify(dbAccount), dbPlatId})
     },
-    tableList({dbPlatId, catalog}) { // 数据库表列表
-        return red.postX('/_db/table_list', {dbPlatId, catalog})
+    tableList({dbPlatId, catalogs}) { // 数据库表列表
+        return red.postX('/_db/table_list', {dbPlatId, catalogs: JSON.stringify(catalogs)})
     },
     tableInfo({dbPlatId, catalog, tableName}) {
         return red.postX('/_db/table_info', {dbPlatId, catalog, tableName})

root/api/table.js

@@ -0,0 +1,15 @@
+const table = {
+    _sheets({cate, filePath, dbAccount, dbPlatId, catalogs}) {
+        return red.postX('/_table/sheets',{cate, filePath, dbAccount, dbPlatId, catalogs})
+    },
+    sheetsExcel({filePath}) {
+        return table._sheets({cate: "excel", filePath})
+    },
+    sheetMySql({dbPlatId, catalogs}) {
+        return table._sheets({cate: "mysql", dbPlatId, catalogs: JSON.stringify(catalogs)})
+    },
+
+    saveTable({dbPlatId, catalog, tableArr}) {
+        return red.postX('/_table/table_save', {dbPlatId, catalog, tableArr: JSON.stringify(tableArr)})
+    }
+}

root/index.html

@@ -93,6 +93,7 @@
 <script src="./api/plat.js" defer></script>
 <script src="./api/qtask.js" defer></script>
 <script src="./api/db.js" defer></script>
+<script src="./api/table.js" defer></script>
 <script src="./res/zui/lib/sortable/zui.sortable.js" defer></script>
 <script src="./res/zui/lib/uploader/zui.uploader.min.js" defer></script>
 <!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->
@@ -135,7 +136,8 @@
                     ]
                 },
                 {name: "关于", url: "/single", nodes: [
-                        {url:"/single/about.html", name:"关于", icon:"icon-server"},
+                        {url:"/single/about.html", name:"关于MetaKit", icon:"icon-server"},
+                        {url:"/single/code.html", name:"整体实现", icon:"icon-server"},
                         {url:"/single/metaFlow.html", name:"MetaKit使用", icon:"icon-server"},
                     ]
                 },
@@ -168,7 +170,7 @@
 
             },
             showInfo() {
-                if (red.getData('userName') === 'root') {
+                if (red.getData('userName') === 'root' || red.getData('userName') === 'admin') {
                     $('#main .info').show()
                 }
             },
@@ -201,7 +203,7 @@
                 var h = document.documentElement.clientHeight || document.body.clientHeight;
                 $("#left").attr("style", "height:" + (h - 50) + "px");
                 $("#main").attr("style", "height:" + (h - 90) + "px; overflow: auto;");
-
+                $(".sheet-cell").attr("style", "height:" + (h - 265) + "px;margin-bottom:20px;");
             }
             autoLeftHeight();
             $(window).resize(function () {

root/metadata/metatable/import.html

@@ -56,17 +56,20 @@
     </div>
 
     <ul class="nav nav-tabs">
-        <li><a href="###" data-target="#tab2Content1" data-toggle="tab">从本地上传</a></li>
-        <li class="active"><a href="###" data-target="#tab2Content2" data-toggle="tab">从数据源导入</a></li>
-        <li><a href="###" data-target="#tab2Content3" data-toggle="tab">其他</a></li>
+        <li @click="cate = excel"><a href="###" data-target="#tab2Content1" data-toggle="tab">从本地上传</a></li>
+        <li @click="cate = mysql" class="active"><a href="###" data-target="#tab2Content2" data-toggle="tab">从数据源导入</a></li>
+        <li @click="cate = oth"><a href="###" data-target="#tab2Content3" data-toggle="tab">其他</a></li>
     </ul>
     <div class="tab-content">
+        <!-- 本地excel导入 -->
         <div class="tab-pane fade" id="tab2Content1">
             <div id="tableUploader" class="uploader">
                 <!--<div class="uploader-message text-center">
                     <div class="content"></div>
                     <button type="button" class="close">×</button>
                 </div>-->
+
+                <!-- 文件上传 -->
                 <table class="table table-bordered">
                     <thead>
                     <tr>
@@ -109,6 +112,7 @@
                     </tfoot>
                 </table>
 
+                <!-- excel sheets -->
                 <div class="row" v-show="sheet">
                     <div class="col-xs-2 sheet-cell">
                         <div style="padding-left: 10px;background-color: #ccc;width: 100%"> Excel-Sheet</div>
@@ -176,8 +180,9 @@
                 </div>
             </div>
         </div>
-        <div class="tab-pane fade active in" id="tab2Content2">
 
+        <!-- 从数据源导入 -->
+        <div class="tab-pane fade active in" id="tab2Content2">
             <div class="form-group">
                 <label class="col-md-1 col-sm-1" style="padding-bottom: 10px;padding-top: 5px;">数据源选择</label>
                 <div class="col-md-2 col-sm-10" style="padding-bottom: 10px">
@@ -187,36 +192,91 @@
                 </div>
                 <div class="col-md-2 col-sm-10" style="padding-bottom: 10px">
                     <select class="form-control" v-model="catalog">
-                        <option v-for="item in catalogs" :value="item" v-text="item"></option>
+                        <option v-for="item in dbPlat['catalogs']" :value="item" v-text="item"></option>
                     </select>
                 </div>
             </div>
 
             <div class="clearfix"></div>
+            <div class="row" v-show="tableName">
+                <div class="col-xs-2 sheet-cell">
+                    <div style="padding-left: 10px;background-color: #ccc;width: 100%"> DB-Table</div>
+                    <ul class="nav nav-tabs nav-stacked tlist" style="height: 100%">
+                        <li class="checkbox-inline clearfix" v-for="item in tableArr" >
+                            <input type="checkbox"
+                                   v-model="ckTable"
+                                   :value="tableData[item]['name']"
+                                   :disabled="item=='表说明' || item=='表名称' || tableData[item]['hv']==1"
+                            >
+                            <a :class="[{hv: tableData[item]['hv']==1 }]" href="javascript:;" @click="tableName=item" data-target="#tab3Content1" data-toggle="tab" v-text="item"></a>
+                        </li>
+                    </ul>
+                    <p v-show="ckTable && ckTable.length">已选择 <code v-text="ckTable.length||0"></code> 个实体待导入</p>
+                </div>
+                <div class="col-xs-8">
+                    <div style="padding-left: 10px;background-color: #ccc;width: 100%"> Table-Detail</div>
+                    <div class="tab-content col-xs-9">
+                        <div class="tab-pane fade active in">
+                            <table class="table-bordered" style="width: 100%">
+                                <caption class="" v-show="tableName && (sheet!='表说明' || sheet!='表名称')">
+                                    表名称： <span v-text="tableInfo.name"></span>，中文名：<span v-text="tableInfo.comment"></span>
+                                </caption>
+                                <thead>
+                                <tr style="background-color: #f1f1f1">
+                                    <th>字段名</th>
+                                    <th>中文名</th>
+                                    <th>数据类型</th>
+                                    <!--<th>输入类型</th>
+                                    <th>附加属性</th>
+                                    <th>备注</th>-->
+                                </tr>
+                                </thead>
+                                <tbody>
+                                <tr v-for="item in tableInfo.items">
+                                    <td v-text="item.name"></td>
+                                    <td v-text="item.label"></td>
+                                    <td v-text="item.type"></td>
+                                    <!--<td v-text="item.inType"></td>
+                                    <td v-text="item.inExt"></td>
+                                    <td v-text="item.remark"></td>-->
+                                </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
 
-            <!--<p>1、选择数据源</p>
-            <p>2、选择查询到的数据源实体</p>
-            <p>3、导入选中的实体</p>-->
         </div>
+
+        <!-- 其他导入 -->
         <div class="tab-pane fade" id="tab2Content3">
             <p>其他一些定制的特殊格式的 实体数据形式</p>
         </div>
     </div>
 
-    <div class="modal-footer">
+    <div class="modal-footer" v-show="cate=='excel'">
         <button @click="ck=[]" type="button" class="btn btn-default" data-dismiss="modal">取消选择</button>
         <button @click="back()" type="button" class="btn btn-default" data-dismiss="modal">取消</button>
         <button @click="saveSheet()" type="button" class="btn btn-primary">确定</button>
     </div>
+    <div class="modal-footer" v-show="cate=='mysql'">
+        <button @click="ckTable=[]" type="button" class="btn btn-default" data-dismiss="modal">取消选择</button>
+        <button @click="back()" type="button" class="btn btn-default" data-dismiss="modal">取消</button>
+        <button @click="saveTable()" type="button" class="btn btn-primary">确定</button>
+    </div>
 </div>
 
 <script>
     let {dbList} = plat
     let {catalogList, tableList, tableInfo} = db
+    let {sheetMySql, saveTable} = table
 
     var vm = new Vue({
         el: ".importDev",
         data: {
+            cate: 'mysql',
+
             filePath: '',
             importStatus: false,
             sheetData: {}, // 所有的完整数据 {name1: {}}
@@ -228,23 +288,14 @@
             // 从数据源导入实体
             dbPlats: red.getData('dbPlats'),
             catalogs: [],
-            dbPlat: {},
-            dbPlatId: '',
+            tableData: {},
+            tableArr:[],
+            dbPlat: red.getData("dbPlat",{}),
+            dbPlatId: red.getData("dbPlatId",''),
             catalog: '',
-            table: '',
+            tableName: '',
+            ckTable: [],
             tableInfo: {},
-
-            cache: {
-                local: {
-                    sheetData: {},
-                    sheetArr: [],
-                    sheet: '',
-                    ck: [],
-                    metaTable: {items: []},
-                },
-                dbPlat: {}
-            },
-
         },
         watch: {
             sheetData: function (v) { // 查询sheet列表数据
@@ -278,9 +329,14 @@
             },
             catalog() {
                 this.loadTables();
+
+                //cache
+                red.setData("dbPlat", this.dbPlat)
+                red.setData("dbPlatId", this.dbPlatId)
+                red.setData("catalog", this.catalog)
             },
-            table() {
-                this.loadTableData();
+            tableName() {
+                this.loadTableInfo();
             }
         },
         methods: {
@@ -305,13 +361,6 @@
 
                 })
             },
-            saveSheet: function () {
-                if (!this.ck || this.ck.length == 0) {
-                    red.showMsg({msg: "请选择导入数据", type:"danger", placement: "top"});
-                    return false;
-                }
-                red.post("/file/import_metatable", {sheetArr: JSON.stringify(this.ck), filePath: this.filePath});
-            },
             getSheetName: function (tableName) {
                 for(k in this.sheetData) {
                     if (this.sheetData[k]['field'] == tableName) {
@@ -326,19 +375,57 @@
             showInfo() {
                 $('#f-info').modal({moveable: true})
             },
-
+            saveSheet: function () {
+                if (!this.ck || this.ck.length == 0) {
+                    red.showMsg({msg: "请选择导入数据", type:"danger", placement: "top"});
+                    return false;
+                }
+                red.post("/file/import_metatable", {sheetArr: JSON.stringify(this.ck), filePath: this.filePath});
+            },
             //------从mysql导入使用的相关方法-------
             loadTables() { // 查询table列表
-
+                sheetMySql({dbPlatId: this.dbPlatId, catalogs: [this.catalog]}).then(res => { // 数据转换
+                    this.tableData = res
+                    let tableArr = []
+                    let ckTable = []
+                    for (k in res) {
+                        tableArr.push(k)
+                        if (res[k]['hv'] != 1) {
+                            ckTable.push(k)
+                        }
+                    }
+                    this.tableArr = tableArr
+                    this.ckTable = ckTable
+                    if(tableArr.length > 0) {
+                        this.tableName = tableArr[0];
+                    }
+                })
             },
-            loadTableData() { // 查询表信息
+            loadTableInfo() { // 查询表信息
+                this.tableInfo = this.tableData[this.tableName]
 
+                if (!this.tableInfo['load']) {
+                    tableInfo({dbPlatId: this.dbPlatId, catalog: this.catalog, tableName: this.tableName}).then(res => {
+                        res['hv'] = this.tableData[this.tableName]['hv']
+                        res['load'] = 1
+
+                        this.tableInfo = res
+                        this.tableData[this.tableName] = res
+                    })
+                }
             },
             saveTable() { // 保存数据
+                let [dbPlatId, catalog, tableArr] = [this.dbPlatId, this.catalog, this.ckTable]
 
+                saveTable({dbPlatId, catalog, tableArr}).then(res => {
+                    red.showOk()
+                    this.loadTables()
+                })
             }
         },
         mounted: function () {
+            setTimeout(() => this.catalog =  red.getData("catalog",''), 100)
+
             // 初始化文件上传组件
             $('#tableUploader').uploader({
                 url: '/upload/x',
@@ -356,7 +443,13 @@
                 }
             });
 
-            dbList().then(res => this.dbPlats = res.rows)
+            dbList().then(res => {
+                this.dbPlats = res.rows
+                /*setTimeout(() => {
+                    this.dbPlat = res.rows[3]
+                    this.tableName = 'db_redbbs'
+                }, 1000)*/
+            })
 
 
             var h = document.documentElement.clientHeight || document.body.clientHeight;

root/res/zui/lib/prettify/prettify.js

@@ -27,5 +27,5 @@ hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb","ruby"]);p(v({keywo
 p(C([],[["str",/^[\S\s]+/]]),["regex"]);var Y=D.PR={createSimpleLexer:C,registerLangHandler:p,sourceDecorator:v,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ",prettyPrintOne:D.prettyPrintOne=function(a,d,g){var b=document.createElement("div");b.innerHTML="<pre>"+a+"</pre>";b=b.firstChild;g&&J(b,g,!0);K({h:d,j:g,c:b,i:1});
 return b.innerHTML},prettyPrint:D.prettyPrint=function(a,d){function g(){for(var b=D.PR_SHOULD_USE_CONTINUATION?c.now()+250:Infinity;i<p.length&&c.now()<b;i++){for(var d=p[i],j=h,k=d;k=k.previousSibling;){var m=k.nodeType,o=(m===7||m===8)&&k.nodeValue;if(o?!/^\??prettify\b/.test(o):m!==3||/\S/.test(k.nodeValue))break;if(o){j={};o.replace(/\b(\w+)=([\w%+\-.:]+)/g,function(a,b,c){j[b]=c});break}}k=d.className;if((j!==h||e.test(k))&&!v.test(k)){m=!1;for(o=d.parentNode;o;o=o.parentNode)if(f.test(o.tagName)&&
 o.className&&e.test(o.className)){m=!0;break}if(!m){d.className+=" prettyprinted";m=j.lang;if(!m){var m=k.match(n),y;if(!m&&(y=U(d))&&t.test(y.tagName))m=y.className.match(n);m&&(m=m[1])}if(w.test(d.tagName))o=1;else var o=d.currentStyle,u=s.defaultView,o=(o=o?o.whiteSpace:u&&u.getComputedStyle?u.getComputedStyle(d,q).getPropertyValue("white-space"):0)&&"pre"===o.substring(0,3);u=j.linenums;if(!(u=u==="true"||+u))u=(u=k.match(/\blinenums\b(?::(\d+))?/))?u[1]&&u[1].length?+u[1]:!0:!1;u&&J(d,u,o);r=
-{h:m,c:d,j:u,i:o};K(r)}}}i<p.length?setTimeout(g,250):"function"===typeof a&&a()}for(var b=d||document.body,s=b.ownerDocument||document,b=[b.getElementsByTagName("pre"),b.getElementsByTagName("code"),b.getElementsByTagName("xmp")],p=[],m=0;m<b.length;++m)for(var j=0,k=b[m].length;j<k;++j)p.push(b[m][j]);var b=q,c=Date;c.now||(c={now:function(){return+new Date}});var i=0,r,n=/\blang(?:uage)?-([\w.]+)(?!\S)/,e=/\bprettyprint\b/,v=/\bprettyprinted\b/,w=/pre|xmp/i,t=/^code$/i,f=/^(?:pre|code|xmp)$/i,
+{h:m,c:d,j:u,i:o};K(r)}}}i<p.length?setTimeout(g,250):"function"===typeof a&&a()}for(var b=d||document.body,s=b.ownerDocument||document,b=[b.getElementsByTagName("pre"),b.getElementsByTagName("code"),b.getElementsByTagName("xmp")],p=[],m=0; m<b.length; ++m)for(var j=0,k=b[m].length; j<k; ++j)p.push(b[m][j]);var b=q,c=Date;c.now||(c={now:function(){return+new Date}});var i=0,r,n=/\blang(?:uage)?-([\w.]+)(?!\S)/,e=/\bprettyprint\b/,v=/\bprettyprinted\b/,w=/pre|xmp/i,t=/^code$/i,f=/^(?:pre|code|xmp)$/i,
 h={};g()}};typeof define==="function"&&define.amd&&define("google-code-prettify",[],function(){return Y})})();}()

root/res/zui/lib/prettify/run_prettify.js

@@ -31,5 +31,5 @@ hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb","ruby"]);i(t({keywo
 i(C([],[["str",/^[\S\s]+/]]),["regex"]);var X=V.PR={createSimpleLexer:C,registerLangHandler:i,sourceDecorator:t,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ",prettyPrintOne:function(a,d,e){var b=document.createElement("div");b.innerHTML="<pre>"+a+"</pre>";b=b.firstChild;e&&z(b,e,!0);D({h:d,j:e,c:b,i:1});return b.innerHTML},
 prettyPrint:e=e=function(a,d){function e(){for(var b=V.PR_SHOULD_USE_CONTINUATION?c.now()+250:Infinity;p<j.length&&c.now()<b;p++){for(var d=j[p],m=k,l=d;l=l.previousSibling;){var n=l.nodeType,s=(n===7||n===8)&&l.nodeValue;if(s?!/^\??prettify\b/.test(s):n!==3||/\S/.test(l.nodeValue))break;if(s){m={};s.replace(/\b(\w+)=([\w%+\-.:]+)/g,function(a,b,c){m[b]=c});break}}l=d.className;if((m!==k||f.test(l))&&!w.test(l)){n=!1;for(s=d.parentNode;s;s=s.parentNode)if(g.test(s.tagName)&&s.className&&f.test(s.className)){n=
 !0;break}if(!n){d.className+=" prettyprinted";n=m.lang;if(!n){var n=l.match(q),A;if(!n&&(A=x(d))&&u.test(A.tagName))n=A.className.match(q);n&&(n=n[1])}if(y.test(d.tagName))s=1;else var s=d.currentStyle,v=i.defaultView,s=(s=s?s.whiteSpace:v&&v.getComputedStyle?v.getComputedStyle(d,r).getPropertyValue("white-space"):0)&&"pre"===s.substring(0,3);v=m.linenums;if(!(v=v==="true"||+v))v=(v=l.match(/\blinenums\b(?::(\d+))?/))?v[1]&&v[1].length?+v[1]:!0:!1;v&&z(d,v,s);t={h:n,c:d,j:v,i:s};D(t)}}}p<j.length?
-P(e,250):"function"===typeof a&&a()}for(var b=d||document.body,i=b.ownerDocument||document,b=[b.getElementsByTagName("pre"),b.getElementsByTagName("code"),b.getElementsByTagName("xmp")],j=[],m=0;m<b.length;++m)for(var l=0,n=b[m].length;l<n;++l)j.push(b[m][l]);var b=r,c=Date;c.now||(c={now:function(){return+new Date}});var p=0,t,q=/\blang(?:uage)?-([\w.]+)(?!\S)/,f=/\bprettyprint\b/,w=/\bprettyprinted\b/,y=/pre|xmp/i,u=/^code$/i,g=/^(?:pre|code|xmp)$/i,k={};e()}};typeof define==="function"&&define.amd&&
+P(e,250):"function"===typeof a&&a()}for(var b=d||document.body,i=b.ownerDocument||document,b=[b.getElementsByTagName("pre"),b.getElementsByTagName("code"),b.getElementsByTagName("xmp")],j=[],m=0; m<b.length; ++m)for(var l=0,n=b[m].length; l<n; ++l)j.push(b[m][l]);var b=r,c=Date;c.now||(c={now:function(){return+new Date}});var p=0,t,q=/\blang(?:uage)?-([\w.]+)(?!\S)/,f=/\bprettyprint\b/,w=/\bprettyprinted\b/,y=/pre|xmp/i,u=/^code$/i,g=/^(?:pre|code|xmp)$/i,k={};e()}};typeof define==="function"&&define.amd&&
 define("google-code-prettify",[],function(){return X})})();return e}();R||P(Q,0)})();}()

root/single/about.html

@@ -1,5 +1,6 @@
 <div id="about">
     <h3>解放生产力，告别重复、累赘；流水线式的创造基础软件；集中火力构筑更扎实的城墙；</h3>
+    <img src="../res/img/code_history.png">
 </div>
 <script>
     var vm = new Vue({

root/single/code.html

@@ -0,0 +1,12 @@
+<div id="about">
+
+    <img src="../res/img/code.png">
+</div>
+<script>
+    var vm = new Vue({
+        el: "#about",
+        data: {
+            about: "AbOUT",
+        }
+    });
+</script>