From f3f2fcb15f81128fdfadd2e97f88b0c66b1bb0ef Mon Sep 17 00:00:00 2001
From: Jiang Peng <2622360564@qq.com>
Date: Sun, 5 May 2024 15:38:57 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E4=BF=AE=E5=A4=8D=E8=B5=84?=
 =?UTF-8?q?=E4=BA=A7=E6=8E=88=E6=9D=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/etl/data.js                        |   7 ++
 src/components/Encoding/index.vue          | 111 +++++++++++++++++++++
 src/views/etl/assetAuthorization/index.vue | 108 +++++++++++---------
 src/views/etl/datasource/index.vue         |  24 +----
 4 files changed, 185 insertions(+), 65 deletions(-)
 create mode 100644 src/components/Encoding/index.vue

diff --git a/src/api/etl/data.js b/src/api/etl/data.js
index a50df65..7da3406 100644
--- a/src/api/etl/data.js
+++ b/src/api/etl/data.js
@@ -42,3 +42,10 @@ export function delData(id) {
     method: 'delete'
   })
 }
+
+export function delById(id) {
+  return request({
+    url: '/etl/data/delById?id=' + id,
+    method: 'post'
+  })
+}
diff --git a/src/components/Encoding/index.vue b/src/components/Encoding/index.vue
new file mode 100644
index 0000000..0575987
--- /dev/null
+++ b/src/components/Encoding/index.vue
@@ -0,0 +1,111 @@
+<template>
+  <div style="height: 800px">
+    <codemirror ref="codeMirror" v-model="code" :value="code" :options="cmOptions"  style="height: 800px"/>
+  </div>
+</template>
+
+<script>
+import { codemirror } from 'vue-codemirror'
+import 'codemirror/mode/clike/clike';
+// cm-setting.js
+// 组件样式
+import 'codemirror/lib/codemirror.css';
+// 主题
+import 'codemirror/theme/eclipse.css';
+// import 'codemirror/theme/monokai.css';
+
+// html代码高亮
+import 'codemirror/mode/htmlmixed/htmlmixed.js';
+
+// 语言模式
+import 'codemirror/mode/javascript/javascript.js';
+import 'codemirror/mode/css/css.js';
+import 'codemirror/mode/xml/xml.js';
+// 代码展开折叠
+import 'codemirror/addon/fold/foldcode.js';
+import 'codemirror/addon/fold/foldgutter.js';
+import 'codemirror/addon/fold/foldgutter.css';
+import 'codemirror/addon/fold/brace-fold.js';
+import {updateMaintenance} from "@/api/ruleEngine/maintenance";
+export default {
+  components: {
+    codemirror,
+  },
+  watch:{
+    'value':{
+      handler(val) {
+        this.code = val
+      },
+    },
+    'modification':{
+      handler(val) {
+        if (val != null){
+          console.log(val)
+          console.log(this.code)
+          updateMaintenance({id: this.modification,codeText: this.code}).then(res => {
+            this.$message.success('修改成功')
+            setTimeout(() => {
+              this.$router.push({ path: `/ruleEngine/engineMaintenance`});
+            },100)
+          })
+
+        }
+      },
+    }
+  },
+  props: {
+    modification:{
+      default: null,
+      type: Number
+    },
+    value: {
+      default: "",
+      type: String
+    },
+    readOnly: {
+      default: false,
+      type: Boolean
+    }
+  },
+  name: "Encoding",
+  data() {
+    return {
+      codemirror: null,
+      code: this.value,
+      cmOptions: {
+        autoRefresh: true, // 重点是这句，为true
+        value: '', // 初始内容
+        mode: 'text/x-java', //实现Java代码高亮
+        tabSize: 4, // tab的空格宽度
+        styleActiveLine: true, // 设置光标所在行高亮true/false
+        lineNumbers: true, //显示行号
+        theme: 'eclipse', //设置主题cobalt/monokai
+        // json: true,
+        readOnly: this.readOnly, // 设置为只读true/false;也可设置为"nocursor"失去焦点
+        lineWrapping: false,
+        foldGutter: true,
+        gutters: [
+          'CodeMirror-lint-markers', //代码错误检测
+          'CodeMirror-linenumbers',
+          'CodeMirror-foldgutter', //展开折叠
+        ],
+      },
+    }
+  },
+  created() {
+  },
+  methods: {}
+}
+</script>
+
+<style>
+
+.CodeMirror {
+  font-family: 'JetBrainsMono-Medium', monospace;
+  height: 800px;
+}
+
+.CodeMirror-lines {
+  line-height: 1.5; /* 这里的1.5是示例，表示行间距是字体大小的1.5倍 */
+}
+</style>
diff --git a/src/views/etl/assetAuthorization/index.vue b/src/views/etl/assetAuthorization/index.vue
index e7f60e6..faedb1a 100644
--- a/src/views/etl/assetAuthorization/index.vue
+++ b/src/views/etl/assetAuthorization/index.vue
@@ -1,18 +1,17 @@
 <template>
   <el-container :style="{height: mainHeight + 'px'}">
     <el-aside>
-      <el-tree :data="assetStructureList"
-               :load="expandTable"
-               :expand-on-click-node="false"
-               lazy
-               @node-click="(data) => showAuth=data.type"
+      <el-menu :default-openeds="['1','3']">
+      <el-tree :data="sourceList"
+               @node-click="handleNodeClick"
                :props="defaultProps">
       </el-tree>
+      </el-menu>
     </el-aside>
     <el-container>
       <el-main>
-        <auth-data-source v-if="showAuth === 'dataSource'"/>
-        <auth-table v-else-if="showAuth === 'dataTable'"/>
+        <auth-data-source v-if="showAuth === 'dataSource'" :title="title"/>
+        <auth-table v-else-if="showAuth === 'dataTable'" :title="title"/>
       </el-main>
     </el-container>
   </el-container>
@@ -21,57 +20,76 @@
 
 import AuthDataSource from './auth/AuthDataSource.vue'
 import AuthTable from './auth/AuthTable.vue'
-import {selectDept} from "@/api/etl/datasource";
+import {dataAssetList, listDatasource} from "@/api/etl/datasource";
 
 export default {
   name: 'assetStructure',
   components: { AuthTable, AuthDataSource },
   data() {
     return {
+      title:{},
       mainHeight: window.innerHeight - 85,
       defaultProps: {
-        children: 'childrenList',
-        label: 'name'
+        children: 'tableList',
+        label: 'label'
       },
       showAuth: null,
-      assetStructureList: [
-        {
-          name: "测试1",
-          //系统名称
-          systemName: "云计算系统",
-          //数据库名称
-          databaseName: "yunjisuan",
-          type: "dataSource"
-        },
+      sourceList: []
 
-      ],
-      childrenList: [
-        {
-          name: "sys_user",
-          as: "用户表",
-          dataTotal: 635847,
-          type: "dataTable",
-          childrenList: []
-        },
-        {
-          name: "sys_dept",
-          as: "部门表",
-          dataTotal: 362548,
-          type: "dataTable",
-          childrenList: []
-        },
-        {
-          name: "sys_notice",
-          as: "通知公告",
-          dataTotal: 6347,
-          type: "dataTable",
-          childrenList: []
-        }
-      ]
     }
   },
+  created() {
+    this.getList()
+  },
   methods: {
-
+    getList(){
+      this.assetsCompute ={
+        assetsModuleSum: 0,
+        dataModuleSum: 0,
+        dataSourceSum: 0
+      }
+      listDatasource(this.queryParams).then(response => {
+        this.sourceList = response.data.rows;
+        this.sourceList.forEach(source => {
+          source.label=source.dataSourceName+'('+source.databaseName+'-'+source.modeName+'-'+source.systemName+')'
+          source.dataType = 'dataSource'
+          if (source.tableList!=null){
+            source.tableList.forEach(table => {
+              table.label = table.tableName +'-'+table.tableComment+'('+table.tableCount+'条)'
+              table.dataType = 'dataTable'
+            })
+          }
+        })
+        this.total = response.data.total;
+      })
+    },
+    handleNodeClick(data){
+      if (data.dataType === 'dataSource'){
+        dataAssetList(data).then(res=>{
+          res.data.forEach(table => {
+            table.dataType = "dataTable"
+            table.label=table.tableName+"-"+table.tableComment+"("+table.tableCount+"条)"
+          })
+          data.tableList = res.data
+          this.sourceList[this.sourceList.indexOf(data)].tableList = res.data
+          this.title = data
+        })
+      }else{
+        this.sourceList.forEach(source => {
+          if (source.tableList !=null){
+            source.tableList.forEach(table => {
+              if (table.tableName === data.dataSourceName){
+                data.dataSourceName = source.dataSourceName
+                data.systemName = source.systemName
+                data.databaseName = source.databaseName
+              }
+            })
+          }
+        })
+        this.title = data
+      }
+      this.showAuth = data.dataType
+    },
     expandTable( node, resolve){
       if (node.level === 0) return resolve(this.assetStructureList);
       const {data} = node;
@@ -81,7 +99,7 @@ export default {
       setTimeout(() => {
         resolve(this.childrenList)
       }, 500);
-    }
+    },
   }
 }
 </script>
diff --git a/src/views/etl/datasource/index.vue b/src/views/etl/datasource/index.vue
index 05ea80d..7cff244 100644
--- a/src/views/etl/datasource/index.vue
+++ b/src/views/etl/datasource/index.vue
@@ -78,6 +78,7 @@
       <el-table-column label="连接地址" align="center" prop="linkAddress" />
       <el-table-column label="数据源名称" align="center" prop="dataSourceName" />
       <el-table-column label="数据库名" align="center" prop="databaseName" />
+      <el-table-column label="数据库类型" align="center" prop="type" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -154,7 +155,7 @@
               <el-form-item label="数据接入类型" prop="type">
                 <el-select style="width: 100%" v-model="form.type">
                   <el-option label="MySql" value="MySql">MySql</el-option>
-                  <el-option label="PostGre" value="PostGre">PostGre</el-option>
+                  <el-option label="Postgres" value="Oracle">Postgres</el-option>
                 </el-select>
               </el-form-item>
             </el-col>
@@ -164,13 +165,6 @@
               </el-form-item>
             </el-col>
           </el-row>
-          <el-row v-if="form.type == 'PostGre'">
-            <el-col :md="12" :sm="24">
-              <el-form-item label="模式名称" prop="modeName">
-                <el-input v-model="form.modeName" placeholder="模式名称" />
-              </el-form-item>
-            </el-col>
-          </el-row>
           <el-row>
             <el-col :md="12" :sm="24">
               <el-form-item label="连接用户名" prop="username">
@@ -280,15 +274,6 @@ import {
 } from "@/api/etl/datasource";
 
 export default {
-  watch:{
-    'form.type':{
-      handler(val) {
-        if(val != 'PostGre'){
-          this.form.modeName = ''
-        }
-      }
-    }
-  },
   name: "Source",
   data() {
     return {
@@ -332,11 +317,11 @@ export default {
         type: [
           {required: true, message: "数据接入类型不能为空", trigger: "blur"}
         ],
-        host: [
+        linkAddress: [
           {required: true, message: "主机地址不能为空", trigger: "blur"}
         ],
         port: [
-          {required: true, message: "主机地址不能为空", trigger: "blur"}
+          {required: true, message: "端口不能为空", trigger: "blur"}
         ],
         databaseName: [
           {required: true, message: "数据库名称不能为空", trigger: "blur"}
@@ -446,7 +431,6 @@ export default {
         username: null,
         password: null,
         linkAddress: null,
-        modeName: null,
         dataSourceName: null,
         databaseName: null
       };