修改表格展示数据

src/components/showDailog/index.vue

 <template>
-  <el-table :data="tableData" border style="width: 100%">
-    <el-table-column prop="name" label="名称" width="150">
-    </el-table-column>
-    <el-table-column prop="description" label="说明" width="120"> </el-table-column>
-    <el-table-column prop="httpMethod" label="消息类型" width="120"></el-table-column>
-    <el-table-column prop="uri" label="端点uri" width="120"></el-table-column>
-    <el-table-column prop="encoding" label="字符编码" width="120"></el-table-column>
-    <el-table-column label="操作" width="100">
-      <template slot-scope="scope">
-        <el-button
-        @click="handleClick(scope.row)"
-        type="text"
-        size="small"
-          >查看</el-button
-        >
-        <el-button type="text" size="small">编辑</el-button>
-      </template>
-    </el-table-column>
-  </el-table>
+  <el-form ref="form" :model="showDailogData" label-width="80px">
+    <el-form-item label="名称">
+      <el-input v-model="showDailogData.name"></el-input>
+    </el-form-item>
+    <el-form-item label="类型">
+      <el-input v-model="showDailogData.ftype"></el-input>
+    </el-form-item>
+    <el-form-item label="项目">
+      <el-input v-model="showDailogData.projectName"></el-input>
+    </el-form-item>
+    <el-form-item label="修改者">
+      <el-input v-model="showDailogData.updatebyname"></el-input>
+    </el-form-item>
+    <el-form-item label="修改时间">
+      <el-input v-model="showDailogData.updateon"></el-input>
+      <!-- <el-col :span="11">
+      <el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
+    </el-col>
+    <el-col class="line" :span="2">-</el-col>
+    <el-col :span="11">
+      <el-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-time-picker>
+    </el-col> -->
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="onSubmit">完成修改</el-button>
+      <el-button>取消</el-button>
+    </el-form-item>
+  </el-form>
 </template>
 
 <script>
 export default {
-  methods: {
-    handleClick(row) {
-      console.log(row)
-    }
-  },
   props: {
     showDailogData: {
       type: Object,
@@ -36,8 +40,11 @@ export default {
     }
   },
   data() {
-    return {
-      tableData: [this.showDailogData]
+    return {}
+  },
+  methods: {
+    onSubmit() {
+      console.log('submit!')
     }
   }
 }

src/views/search/index.vue

@@ -652,9 +652,11 @@ export default {
       }
     },
     // 表格操作，弹出框
-    handleDailog(ftype, data) {
-      this.ftype = ftype
-      this.showDailogData = data
+    handleDailog(row) {
+      console.log('row', row)
+      this.ftype = row.ftype
+      this.showDailogData = row
+      console.log(this.showDailogData)
       // console.log('res.data.list[0]', res.data.list[0])
       // 展示dailog组件
       this.isShowEditDailog = true
@@ -673,7 +675,7 @@ export default {
             if (res.status === '200') {
               // vm.currentRow = res.data.list[0]
               // vm.type = 'business'
-              vm.handleDailog(row.ftype, res.data.list[0])
+              vm.handleDailog(row)
             }
           })
           break
@@ -682,7 +684,7 @@ export default {
             if (res.status === '200') {
               // vm.currentRow = res.data.list[0]
               // vm.type = 'flow'
-              vm.handleDailog(row.ftype, res.data.list[0])
+              vm.handleDailog(row.ftype)
             }
           })
           break
@@ -691,7 +693,7 @@ export default {
             if (res.status === '200') {
               // vm.currentRow = res.data.list[0]
               // vm.type = 'agency'
-              vm.handleDailog(row.ftype, res.data.list[0])
+              vm.handleDailog(row.ftype)
             }
           })
           break