.

root/api/meta.js

@@ -53,5 +53,62 @@ const meta = {
     },
     linkSave({link}) {
         return red.postX('/meta/link_save', {link: JSON.stringify(link)})
+    },
+    linkInfo({alias}) {
+        return red.postX('/meta/link_info', {alias})
+    },
+    tableInfo({name, alias}) {
+        return red.postX('/meta/tableinfo', {name, alias})
     }
-}
+}
+
+let a = [
+    {
+        name: '',
+        alias: '',
+        link: [
+            {"a.id": "b.x"}
+        ],
+    }
+]
+
+/*
+
+let list = [
+    {id: 1, pid:0},
+    {id: 2, pid:0},
+    {id: 3, pid:0},
+    {id: 4, pid:1},
+    {id: 5, pid:2},
+    {id: 6, pid:5},
+    {id: 7, pid:1},
+    {id: 8, pid:0},
+]
+
+
+class Tree {
+    constructor(id, pid) {
+        this.id = id
+        this.pid = pid
+        this.left = undefined;
+        this.right = undefined;
+        this.nodes = []
+    }
+    add(tree) {
+        this.nodes.push(tree)
+    }
+}
+
+let nodes = new Tree(null, 0);
+
+
+for (let x of list) {
+    if (x.pid == 0) {
+        nodes.add(x)
+        continue
+    }
+
+    for (let i = 0; i < x.nodes.length; i++) {
+
+    }
+}*/

root/metadata/metaLink.html

@@ -27,6 +27,9 @@
     .tlist>li>a:hover {
         background-color: #92b0cb;
     }
+    th,td {
+        padding: 5px;
+    }
 </style>
 <row class="meta-link">
     <div class="info">
@@ -65,33 +68,139 @@
     </div>
 
     <div class="col-xs-8">
-        {{ tableAlias }}
+
+        <button @click="aliasB=link.alias" :class="['btn', {'primary' :aliasB==link.alias}]" v-for="link in linkInfo" v-text="link.comment" style="margin-right: 5px"> </button>
+
+
+        <table class="table-bordered" style="width: 100%; margin-top: 10px">
+            <tr>
+                <th width="120px">关联的表</th>
+                <th colspan="2">关联字段</th>
+                <th>操作</th>
+            </tr>
+
+
+            <tbody v-html="buildTable(linkInfo)">
+
+            </tbody>
+
+            <!--<tr v-for="item in linkInfo">
+                <td rowspan="2" v-text="xx"></td>
+
+                <td>deptId</td>
+                <td>id</td>
+                <td rowspan="2">修改</td>
+            </tr>
+            <tr>
+                <td>deptId</td>
+                <td>id</td>
+            </tr>-->
+        </table>
+
     </div>
-</row>
+
+
+    <!--<div class="modal fade" id="edit">
+        <div class="modal-dialog modal-lg">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
+                    <h4 class="modal-title">功能概览</h4>
+                </div>
+                <div class="modal-body" style="text-align: center">
+                    <table class="table-bordered" style="width: 100%">
+                        <tr>
+                            <th v-text="tableA.comment"></th>
+                            <th v-text="tableB.comment"></th>
+                            <th>操作</th>
+                        </tr>
+                        <tr v-for="key in linkInfo.link">
+                           <td>
+                               <span v-text="key"></span>
+                           </td>
+                           <td>
+                               <span v-text="linkInfo.link[key]"></span>
+                           </td>
+                        </tr>
+
+                    </table>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
+                </div>
+            </div>
+        </div>
+    </div>-->
+ </row>
 
 <script>
-    let {tableLinkList, linkSave} = meta
+    let {tableLinkList, linkSave, linkInfo, tableInfo} = meta
     var vm = new Vue({
         el: ".meta-link",
         data: {
             tables: [],
             tableName: '',
             tableAlias: '',
+            aliasB: '',
+            tableA: {},
+            tableB: {},
+            linkInfo: {},
+            link: {},
 
         },
         watch: {
-
+            tableAlias(v) {
+                let alias = v
+                linkInfo({alias}).then(res => {
+                    this.linkInfo = res
+                })
+                tableInfo({alias}).then(res => this.tableA = res)
+            }
         },
         methods: {
             loadLinkList() {
                 tableLinkList().then(res => {
                     this.tables = res
-                    console.log(res)
                 })
             },
             tableItem(table) {
                 return `${table.name} [${table.comment}] (${table.linkCount})`
             },
+            buildTable(linkInfo) {
+                let html = ''
+
+                for (let i = 0; i < linkInfo.length; i++) {
+                    let link = linkInfo[i].link
+
+                    html += `<tr>`
+                    html += `<td rowspan='${linkInfo[i].linkSize}'>${linkInfo[i].name} [${linkInfo[i].comment}]</td>`
+                    for (let k in link) {
+                        html +=  `<td>${k}</td><td>${link[k]}</td>`
+                        break
+                    }
+
+                    html += `<td rowspan='${linkInfo[i].linkSize}'><a href="javascript:vm.edit('${linkInfo[i]['alias']}');">修改</a></td>`
+                    html += '</tr>'
+
+                    let t = 0
+                    for (let k in link) {
+                        if (++t == 1) continue
+                        html += '<tr>'
+                        html +=  `<td>${k}</td><td>${link[k]}</td>`
+                        html += '</tr>'
+                    }
+                }
+                return html
+            },
+            edit(alias) {
+                this.linkAlias = alias
+
+                // 查询关联表的信息
+                tableInfo({alias}).then(res => {
+                    this.tableB = res
+                    $('#edit').modal()
+                })
+            },
             showInfo() {
                 $('#f-info').modal({moveable: true})
             }