From 774cc447d4d1ab159ad7821a1690a4b6cbabf491 Mon Sep 17 00:00:00 2001
From: xiaohuang <1559741705@qq.com>
Date: Sat, 27 Apr 2024 16:56:23 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B5=84=E4=BA=A7=E7=BB=93=E6=9E=84=E6=B5=8B?=
 =?UTF-8?q?=E8=AF=955?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/etl/construction/AssetsModel.vue | 366 +++++++++++----------
 src/views/etl/construction/index.vue       |  17 +-
 2 files changed, 202 insertions(+), 181 deletions(-)

diff --git a/src/views/etl/construction/AssetsModel.vue b/src/views/etl/construction/AssetsModel.vue
index e58a251..cf2d511 100644
--- a/src/views/etl/construction/AssetsModel.vue
+++ b/src/views/etl/construction/AssetsModel.vue
@@ -1,184 +1,189 @@
 <template>
-  <el-row :gutter="40" class="panel-group">
+              <div>
+
+                <el-row :gutter="40" class="panel-group">
+                  <!--    insertDictOpen {{ this.insertDictOpen }}-->
+                  <!--    <p></p>-->
+                  <!--    assetDictFormInfo {{ this.assetDictFormInfo }}-->
+                  <!--    <p></p>-->
+                  <!--    dictFormInfoOpen {{ this.dictFormInfoOpen }}-->
+                  <!--    <p></p>-->
+                  <!--    dictFormInfo {{ this.dictFormInfo }}-->
+                  <!--    <p></p>-->
+                  <el-card>
+                    <el-tabs type="border-card" @tab-click="handleClick">
+                      <el-tab-pane
+                        v-for="tableInfo in tableInfoList"
+                        :label="tableInfo.tableName+'('+tableInfo.info.tableRemark+')'">
+                        <el-card>
+                          <div slot="header" class="clearfix">
+
+                            <span>基础字典</span>
+                            <!--新增字典表-->
+                            <el-button type="text" style="float: right" @click="insertDictOpen = true">新增字典</el-button>
+                          </div>
+                              <el-row gutter="20">
+                                <el-col v-for="dictInfo in dictList" :span="8">
+                                  <el-card style="width: 300px;">
+                                    <div slot="header" class="clearfix">
+                                      <span>{{ dictInfo.dictName }}({{ dictInfo.dictType }})</span>
+                                      <!--新增字典具体信息-->
+                                      <el-button style="float: right; padding: 3px 0" type="text" @click="insertDictList(dictInfo)">新增内容
+                                      </el-button>
+                                    </div>
+                                    <el-table :data="dictInfo.dictInfoList">
+                                      <el-table-column label="标签">
+                                        <template slot-scope="scope">
+                                          <span v-if="!scope.row.isEdit">{{ scope.row.infoName }}</span>
+                                          <el-input :value="scope.row.infoName"
+                                                    v-model="scope.row.infoName"
+                                                    v-if="scope.row.isEdit"></el-input>
+                                        </template>
+                                      </el-table-column>
+                                      <el-table-column label="值">
+                                        <template slot-scope="scope">
+                                          <span v-if="!scope.row.isEdit">{{ scope.row.infoValue }}</span>
+                                          <el-input :value="scope.row.infoValue"
+                                                    v-model="scope.row.infoValue"
+                                                    v-if="scope.row.isEdit"></el-input>
+                                        </template>
+                                      </el-table-column>
+                                      <el-table-column>
+                                        <template slot-scope="scope">
+                                          <el-button type="text" v-if="!scope.row.isEdit" @click="scope.row.isEdit = true">操作</el-button>
+                                          <el-button type="text" v-if="scope.row.isEdit" @click="insertDictInfo(dictInfo.id,scope.row)">确认</el-button>
+                                          {{ scope.row.isEdit }}
+                                        </template>
+                                      </el-table-column>
+                                    </el-table>
+                                  </el-card>
+                                </el-col>
+                              </el-row>
+                        </el-card>
+
+                        <!--资产模型基本信息-->
+                        <el-card>
+                          <div slot="header" class="clearfix">
+                            <span>资产模型基本信息</span>
+                          </div>
+
+                          <el-descriptions
+                            class="margin-top"
+                            :column="2"
+                            border>
+
+                            <el-descriptions-item>
+                              <template slot="label">
+                                <i class="el-icon-user"></i>
+                                表名称
+                              </template>
+                             {{tableInfo.info.tableName}}
+                            </el-descriptions-item>
+
+                               <el-descriptions-item>
+                              <template slot="label">
+                                <i class="el-icon-mobile-phone"></i>
+                                表备注
+                              </template>
+                             {{tableInfo.info.tableRemark}}
+                            </el-descriptions-item>
+
+                               <el-descriptions-item>
+                              <template slot="label">
+                                <i class="el-icon-location-outline"></i>
+                                数据量
+                              </template>
+                             {{tableInfo.info.dataNum}}
+                            </el-descriptions-item>
+
+
+                               <el-descriptions-item>
+                              <template slot="label">
+                                <i class="el-icon-tickets"></i>
+                                备注
+                              </template>
+                           <el-tag size="small">小黄</el-tag>
+                            </el-descriptions-item>
+                          </el-descriptions>
+                        </el-card>
+
+
+                        <!--数据模型-->
+                        <el-card>
+
+                          <div slot="header" class="clearfix">
+                            <span>数据模型</span>
+                          </div>
+
+
+                          <el-table
+                            :data="tableInfo.info.structureList"
+                            style="width: 100%">
+
+                            <el-table-column fixed prop="columnName" label="字段名称" width="200px"/>
+                            <el-table-column fixed prop="columnRemark" label="字段注释" />
+                            <el-table-column fixed prop="isPrimary" label="是否主键" />
+                            <el-table-column fixed prop="columnType" label="数据类型" />
+                            <el-table-column fixed prop="javaType" label="映射类型" />
+                            <el-table-column fixed prop="columnLength" label="字段长度" />
+                            <el-table-column fixed prop="columnDecimals" label="小数位数" />
+                            <el-table-column fixed prop="isNull" label="是否为空" />
+                            <el-table-column fixed prop="defaultValue" label="默认值" />
+                            <el-table-column fixed prop="isDictionary" label="是否字典" />
+                            <el-table-column fixed prop="dictionaryTable" label="映射字典" />
+                            <el-table-column fixed prop="dictionaryTable" label="映射字典" >
+                              <template slot-scope="scope">
+                                操作
+                              </template>
+                            </el-table-column>
+                          </el-table>
+                        </el-card>
+                      </el-tab-pane>
+                    </el-tabs>
+                  </el-card>
+                </el-row>
+
+                <!--添加新字典表对话框-->
+                <el-dialog title="字典表基础信息" style="float:left; margin:20px" :visible.sync="insertDictOpen">
+                  <el-form :model="assetDictFormInfo">
 
-    <!--    insertDictOpen {{ this.insertDictOpen }}-->
-    <!--    <p></p>-->
-    <!--    assetDictFormInfo {{ this.assetDictFormInfo }}-->
-    <!--    <p></p>-->
-    <!--    dictFormInfoOpen {{ this.dictFormInfoOpen }}-->
-    <!--    <p></p>-->
-    <!--    dictFormInfo {{ this.dictFormInfo }}-->
-    <!--    <p></p>-->
-    <el-card>
-      <el-tabs type="border-card" @tab-click="handleClick">
-        <el-tab-pane
-          v-for="tableInfo in tableInfoList"
-          :label="tableInfo.tableName+'('+tableInfo.info.tableRemark+')'">
-          <el-card>
-            <div slot="header" class="clearfix">
-              <span>基础字典</span>
-              <!--新增字典表-->
-              <el-button type="text" style="float: right" @click="insertDictOpen = true">新增字典</el-button>
-              <el-dialog title="字典表基础信息"  style="float:left; margin:20px" :visible.sync="insertDictOpen">
-                <el-form :model="assetDictFormInfo">
                   <el-form-item label="字典表名" label-width="120px">
                     <el-input v-model="assetDictFormInfo.dictName" autocomplete="off"></el-input>
                   </el-form-item>
-                  <el-form-item label="字典类型" label-width="120px">
-                    <el-input v-model="assetDictFormInfo.dictType" autocomplete="off"></el-input>
-                  </el-form-item>
-                </el-form>
-                <div slot="footer" class="dialog-footer">
-                  <el-button @click="insertDictOpen = false">取 消</el-button>
-                  <el-button type="primary" @click="insertDict(tableInfo.info)">确 定</el-button>
-                </div>
-              </el-dialog>
-            </div>
-            <el-card v-for="dictInfo in dictList" style="width: 300px;">
-              <div slot="header" class="clearfix">
-                <span>{{ dictInfo.dictName }}({{ dictInfo.dictType }})</span>
-                <!--新增字典具体信息-->
-                <el-button style="float: right; padding: 3px 0" type="text" @click="insertDictList(dictInfo)">新增内容
-                </el-button>
+
+                    <el-form-item label="字典类型" label-width="120px">
+                      <el-input v-model="assetDictFormInfo.dictType" autocomplete="off"></el-input>
+                    </el-form-item>
+
+                  </el-form>
+
+                  <div slot="footer" class="dialog-footer">
+                    <el-button @click="insertDictOpen = false">取消</el-button>
+                    <el-button type="primary" @click="insertDict(tableInfo.info)">确定</el-button>
+                  </div>
+                </el-dialog>
               </div>
-              <el-table :data="dictInfo.dictInfoList">
-                <el-table-column label="标签">
-                  <template slot-scope="scope">
-                    <span v-if="!scope.row.isEdit">{{ scope.row.infoName }}</span>
-                    <el-input :value="scope.row.infoName"
-                              v-model="scope.row.infoName"
-                              v-if="scope.row.isEdit"></el-input>
-                  </template>
-                </el-table-column>
-                <el-table-column label="值">
-                  <template slot-scope="scope">
-                    <span v-if="!scope.row.isEdit">{{ scope.row.infoValue }}</span>
-                    <el-input :value="scope.row.infoValue"
-                              v-model="scope.row.infoValue"
-                              v-if="scope.row.isEdit"></el-input>
-                  </template>
-                </el-table-column>
-                <el-table-column>
-                  <template slot-scope="scope">
-                    <el-button type="text" v-if="!scope.row.isEdit" @click="updateDictInfo(scope.row)">操作</el-button>
-                    <el-button type="text" v-if="scope.row.isEdit" @click="insertDictInfo(scope.row)">确认</el-button>
-                    {{ scope.row.isEdit }}
-                  </template>
-                </el-table-column>
-              </el-table>
-            </el-card>
-          </el-card>
-          <!--资产模型基本信息-->
-          <el-card>
-            <div slot="header" class="clearfix">
-              <span>资产模型基本信息</span>
-            </div>
-            <el-descriptions
-              class="margin-top"
-              :column="2"
-              border>
-              <el-descriptions-item>
-                <template slot="label">
-                  <i class="el-icon-user"></i>
-                  表名称
-                </template>
-                {{ tableInfo.info.tableName }}
-              </el-descriptions-item>
-              <el-descriptions-item>
-                <template slot="label">
-                  <i class="el-icon-mobile-phone"></i>
-                  表备注
-                </template>
-                {{ tableInfo.info.tableRemark }}
-              </el-descriptions-item>
-              <el-descriptions-item>
-                <template slot="label">
-                  <i class="el-icon-location-outline"></i>
-                  数据量
-                </template>
-                {{ tableInfo.info.dataNum }}
-              </el-descriptions-item>
-              <el-descriptions-item>
-                <template slot="label">
-                  <i class="el-icon-tickets"></i>
-                  备注
-                </template>
-                <el-tag size="small">学校</el-tag>
-              </el-descriptions-item>
-            </el-descriptions>
-          </el-card>
-          <!--数据模型-->
-          <el-card>
-            <div slot="header" class="clearfix">
-              <span>数据模型</span>
-            </div>
-            <el-table
-              :data="tableInfo.info.structureList"
-              style="width: 100%"
-            >
-              <el-table-column fixed prop="columnName" label="字段名称" width="200px"/>
-              <el-table-column fixed prop="columnRemark" label="字段注释"/>
-              <el-table-column fixed prop="isPrimary" label="是否主键"/>
-              <el-table-column fixed prop="columnType" label="数据类型"/>
-              <el-table-column fixed prop="javaType" label="映射类型"/>
-              <el-table-column fixed prop="columnLength" label="字段长度"/>
-              <el-table-column fixed prop="columnDecimals" label="小数位数"/>
-              <el-table-column fixed prop="isNull" label="是否为空"/>
-              <el-table-column fixed prop="defaultValue" label="默认值"/>
-              <el-table-column fixed prop="isDictionary" label="是否字典"/>
-              <el-table-column fixed prop="dictionaryTable" label="映射字典"/>
-              <el-table-column fixed prop="dictionaryTable" label="映射字典">
-                <template slot-scope="scope">
-                  操作
-                </template>
-              </el-table-column>
-
-            </el-table>
-          </el-card>
-        </el-tab-pane>
-      </el-tabs>
-    </el-card>
-
-
-
-  </el-row>
 </template>
-
 <script>
-import CountTo from 'vue-count-to'
+import CountTo from "vue-count-to";
 import {insertDict,insertDictInfo} from "@/api/etl/etl";
 
 export default {
-  props:{
+
+  props: {
     tableInfoList: Array,
     dictList: Array
   },
 
-
-  watch:{
-    dictList: {
-      handler(newValue, oldValue) {
-        console.log(newValue)
-        console.log(oldValue)
-        this.$forceUpdate()
-      },
-
-      immediate: true,
-      deep: true
-    }
-  },
-
-
-
   name: 'AssetsModel',
-  components: {
+  components:{
     CountTo
   },
 
-  data() {
+  data(){
     return {
-      tableInfoList:this.tableInfoList,
-      dictList:this.dictList,
+      tableInfoList: this.tableInfoList,
+      dictList: this.dictList,
       //新增字典表
       insertDictOpen: false,
       dictFormInfoOpen: false,
@@ -192,11 +197,11 @@ export default {
   },
 
   methods: {
-
-//点击修改字典操作
-    updateDictInfo(row){
+    //点击修改字典操作
+    updateDictInfo(row) {
       row.isEdit = true
     },
+
     //前台添加字典新内容
     insertDictList(data) {
       console.log(data)
@@ -207,39 +212,43 @@ export default {
         'isEdit': true,
       })
     },
+
     //添加字典接入表
     insertDict(data) {
       console.log(data)
+
       //关闭新增字典窗口
       this.insertDictOpen = false
       this.assetDictFormInfo.basicId = data.basicId
       console.log(this.assetDictFormInfo)
-      insertDict(this.assetDictFormInfo)
+      insertDict(this.insertDictOpen)
       this.reset()
     },
+
     //字典具体信息表
-    insertDictInfo(row) {
+    insertDictInfo(id,row){
+      console.log(row)
+      console.log(id)
+      row.dictId = id
+      row.id = null
       if (row.infoValue === null || row.infoName === null) {
         this.$message.error("字典标签或者值不能为空")
-      } else {
+      }else {
         insertDictInfo(row)
         this.$message.success("添加成功")
         this.reset()
+        row.isEdit = false
       }
     },
-
-
     handleSetLineChartData(type) {
       this.$emit('handleSetLineChartData', type)
     },
-
-    handleClick(val,event){
+    handleClick(val, event) {
       console.log(val)
       console.log(event)
     },
-
     //重置参数
-    reset(){
+    reset() {
 
     }
   }
@@ -354,10 +363,17 @@ export default {
     }
   }
 }
-.title-header{
+
+.title-header {
   text-align: center;
   width: 100%;
   font-size: 46px;
-ia
+  font-weight: 600;
+  line-height: 100px;
 }
 </style>
+
+
+
+
+
diff --git a/src/views/etl/construction/index.vue b/src/views/etl/construction/index.vue
index 5146ba8..7307b70 100644
--- a/src/views/etl/construction/index.vue
+++ b/src/views/etl/construction/index.vue
@@ -2,18 +2,21 @@
   <div>
       <el-container style="height: 1000px">
         <el-aside>
-
           <el-tree :data="assetStructureList"
                    :props="defaultProps"
-                   @node-click="handleNodeClick"></el-tree>
+                   @node-click="handleNodeClick">
+
+          </el-tree>
         </el-aside>
+
         <el-main>
+          <AssetsBasic v-if="!infoOpen" :info-open="infoOpen" :fund-data-num="fundDataNum"></AssetsBasic>
+          <AssetsModel v-if="this.tableInfoList.length!==0" :dict-list="dictList" :table-info-list="tableInfoList">
+          </AssetsModel>
 
-          <AssetsBasic v-if="!infoOpen" :infoOpen="infoOpen" :fundDataNum="fundDataNum"></AssetsBasic>
-          <AssetsModel v-if="this.tableInfoList.length!==0" :dictList="dictList" :tableInfoList="tableInfoList"></AssetsModel>
           <TableInfoModel v-if="this.tableInfoList.length===0" :table-info="tableInfoForm"></TableInfoModel>
-
         </el-main>
+
       </el-container>
   </div>
 </template>
@@ -27,7 +30,9 @@ import TableInfoModel from "@/views/etl/construction/TableInfoModel.vue";
 
 export default {
   name:'construction',
+
   components:{TableInfoModel, AssetsModel, AssetsBasic },
+
   data() {
     return {
       //表详情页面
@@ -115,12 +120,12 @@ export default {
         if (data.children !== undefined) {
           this.tableInfoList = data.children
           this.tableInfoForm = data.children[0]
-        }else {
           console.log(data.info.id)
           getDict(data.info.id).then(response => {
             console.log(response)
             this.dictList = response.data
           })
+        }else {
 
           // this.tableInfoList = this.assetStructureList.find(assent =>
           //   assent.info.id === this.tableInfoForm.info.basicId