弹窗不显示问题优化

.env.development

@@ -5,7 +5,8 @@ VUE_APP_TITLE = 若水数据中台
 ENV = 'development'
 
 # 若水数据中台/开发环境
-VUE_APP_BASE_API = ''
+# VUE_APP_BASE_API = ''
+# VUE_APP_BASE_API = 'http://192.168.100.38:10001'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

src/views/datax/executor/index.vue

@@ -54,7 +54,7 @@
     </el-table>
     <pagination v-show="total>0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="fetchData" />
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" append-to-body="true">
       <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="89px" style="width: 400px; margin-left:50px;">
 
 

src/views/datax/jdbc-datasource/index.vue

@@ -88,7 +88,7 @@
       @pagination="fetchData"
     />
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="800px">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="800px" append-to-body="true">
       <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="100px">
         <el-form-item label="数据源" prop="datasource">
           <el-select
@@ -178,7 +178,7 @@
         </el-button>
       </div>
     </el-dialog>
-    <el-dialog :visible.sync="dialogPluginVisible" title="Reading statistics">
+    <el-dialog :visible.sync="dialogPluginVisible" title="Reading statistics" append-to-body="true">
       <el-table :data="pluginData" border fit highlight-current-row style="width: 100%">
         <el-table-column prop="key" label="Channel" />
         <el-table-column prop="pv" label="Pv" />

src/views/datax/jobInfo/index.vue

@@ -131,7 +131,7 @@
 
     <pagination v-show="total>0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="fetchData" />
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="1000px" :before-close="handleClose">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="1000px" :before-close="handleClose" append-to-body="true">
       <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="110px">
         <el-row :gutter="20">
           <el-col :span="12">
@@ -446,7 +446,9 @@ export default {
         readerTable: ''
       },
       resetTemp() {
-        this.temp = this.$options.data().temp
+        // 重置temp对象的属性，而不是替换整个对象，以保持响应式
+        const initialTemp = this.$options.data().temp
+        Object.assign(this.temp, initialTemp)
         this.jobJson = ''
         this.glueSource = ''
         this.timeOffset = 0
@@ -571,35 +573,54 @@ export default {
     incStartTimeFormat(vData) {
     },
     handleCreate() {
+      // 直接重置表单可见性，避免之前的状态影响
+      this.dialogFormVisible = false
+      
+      // 重置temp对象
       this.resetTemp()
+      
+      // 设置弹窗状态
       this.dialogStatus = 'create'
+      
+      // 先显示弹窗
       this.dialogFormVisible = true
+      
+      // 使用nextTick确保DOM更新后再清除验证
       this.$nextTick(() => {
+        if (this.$refs['dataForm']) {
           this.$refs['dataForm'].clearValidate()
+        }
       })
     },
     handlerUpdate(row) {
+      console.log(row)
+      // 直接重置表单可见性，避免之前的状态影响
+      this.dialogFormVisible = false
+      
+      // 重置temp对象，使用响应式的初始对象
       this.resetTemp()
-      this.temp = Object.assign({}, row) // copy obj
+      
+      // 逐个赋值row的属性，保持temp对象的响应式
+      Object.assign(this.temp, row)
+      
+      // 处理jobJson
       if (this.temp.jobJson) {
+        try {
           this.jobJson = JSON.parse(this.temp.jobJson)
-        this.temp.jobJson = JSON.parse(this.temp.jobJson)
-      }
-
-      this.glueSource = this.temp.glueSource
-      const arrchildSet = []
-      const arrJobIdList = []
-      if (this.jobIdList) {
-        for (const n in this.jobIdList) {
-          if (this.jobIdList[n].id !== this.temp.id) {
-            arrJobIdList.push(this.jobIdList[n])
-          }
+        } catch (e) {
+          console.error('解析jobJson失败:', e)
+          this.jobJson = ''
         }
-        this.JobIdList = arrJobIdList
+      } else {
+        this.jobJson = ''
       }
 
+      this.glueSource = this.temp.glueSource || ''
+      
+      // 处理子任务
       if (this.temp.childJobId) {
         const arrString = this.temp.childJobId.split(',')
+        const arrchildSet = []
         for (const i in arrString) {
           for (const n in this.jobIdList) {
             if (this.jobIdList[n].id === parseInt(arrString[i])) {
@@ -608,17 +629,29 @@ export default {
           }
         }
         this.temp.childJobId = arrchildSet
+      } else {
+        this.temp.childJobId = []
       }
+      
+      // 处理分区信息
       if (this.temp.partitionInfo) {
         const partition = this.temp.partitionInfo.split(',')
-        this.partitionField = partition[0]
-        this.timeOffset = partition[1]
-        this.timeFormatType = partition[2]
+        this.partitionField = partition[0] || ''
+        this.timeOffset = parseInt(partition[1]) || 0
+        this.timeFormatType = partition[2] || 'yyyy-MM-dd'
       }
+      
+      // 设置弹窗状态和显示
       this.dialogStatus = 'update'
+      
+      // 先显示弹窗
       this.dialogFormVisible = true
+      
+      // 使用nextTick确保DOM更新后再清除验证
       this.$nextTick(() => {
+        if (this.$refs['dataForm']) {
           this.$refs['dataForm'].clearValidate()
+        }
       })
     },
     createData() {

src/views/datax/jobLog/index.vue

@@ -89,7 +89,7 @@
       @pagination="fetchData"
     />
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="600px">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="600px" append-to-body="true">
       <el-form ref="dataForm" :rules="rules" :model="temp" label-position="center" label-width="100px">
         <el-row>
           <el-col :span="14" :offset="5">
@@ -124,7 +124,7 @@
         </el-button>
       </div>
     </el-dialog>
-    <el-dialog title="日志查看" :visible.sync="dialogVisible" width="95%">
+    <el-dialog title="日志查看" :visible.sync="dialogVisible" width="95%" append-to-body="true">
       <div class="log-container">
         <pre :loading="logLoading" v-text="logContent" />
       </div>
@@ -263,7 +263,9 @@ export default {
       this.dialogStatus = 'create'
       this.dialogFormVisible = true
       this.$nextTick(() => {
+        if (this.$refs['dataForm']) {
           this.$refs['dataForm'].clearValidate()
+        }
       })
     },
     deleteLog() {
@@ -315,7 +317,6 @@ export default {
     killRunningJob(row) {
       log.killJob(row).then(response => {
         this.fetchData()
-        this.dialogFormVisible = false
         this.$notify({
           title: 'Success',
           message: 'Kill Successfully',

src/views/datax/jobProject/index.vue

@@ -73,7 +73,7 @@
       @pagination="fetchData"
     />
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="800px">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="800px" append-to-body="true">
       <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="100px">
         <el-form-item label="项目名称" prop="name">
           <el-input v-model="temp.name" placeholder="项目名称" style="width: 40%" />
@@ -91,7 +91,7 @@
         </el-button>
       </div>
     </el-dialog>
-    <el-dialog :visible.sync="dialogPluginVisible" title="Reading statistics">
+    <el-dialog :visible.sync="dialogPluginVisible" title="Reading statistics" append-to-body="true">
       <el-table :data="pluginData" border fit highlight-current-row style="width: 100%">
         <el-table-column prop="key" label="Channel" />
         <el-table-column prop="pv" label="Pv" />

src/views/datax/jobTemplate/index.vue

@@ -93,7 +93,7 @@
     </el-table>
     <pagination v-show="total>0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="fetchData" />
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="1000px" :before-close="handleClose">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="1000px" :before-close="handleClose" append-to-body="true">
       <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="110px">
         <el-row :gutter="20">
           <el-col :span="12">

src/views/datax/resource/index.vue

@@ -86,7 +86,7 @@
       :limit.sync="listQuery.size"
       @pagination="fetchData"
     />
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" append-to-body="true">
       <el-form
         ref="dataForm"
         :rules="rules"