站点编辑

src/pages/site/list/index.vue

@@ -14,15 +14,12 @@
         </template>
       </el-table-column>
       <el-table-column prop="siteName" label="站点名称" align="center"></el-table-column>
-      <el-table-column prop="domainName" label="域名" width="400" align="center">
-        <template slot-scope="scope">
-          <el-input v-model.trim="scope.row.domainName" placeholder="请输入域名" @change="update(scope.row)"></el-input>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="170" align="center">
+      <el-table-column prop="domainName" label="域名" width="400" align="center"></el-table-column>
+      <el-table-column label="操作" width="200" align="center">
         <template slot-scope="scope">
           <el-button type="text" @click="toIndex(scope.row)">前往网站首页</el-button>
           <el-button type="text" @click="content(scope.row)">内容管理</el-button>
+          <el-button type="text" @click="edit(scope.row)">编辑</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -30,6 +27,21 @@
       <el-pagination background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange"
         :current-page="page"></el-pagination>
     </div>
+
+    <el-dialog title="编辑站点" :visible.sync="siteVisible" width="400px" :close-on-click-modal="false">
+      <el-form ref="form" label-width="70px">
+        <el-form-item label="站点名称">
+          <el-input v-model="form.siteName" placeholder="请输入站点名称"></el-input>
+        </el-form-item>
+        <el-form-item label="域名">
+          <el-input v-model="form.domainName" placeholder="请输入域名"></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="siteVisible = false">取消</el-button>
+        <el-button type="primary" @click="submit">确定</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -44,7 +56,14 @@ export default {
       page: +this.$route.query.page || 1,
       pageSize: 10,
       total: 0,
-      list: []
+      list: [],
+
+      siteVisible: false,
+      form: {
+        id: '',
+        siteName: '',
+        domainName: '',
+      },
     };
   },
   computed: {
@@ -88,13 +107,6 @@ export default {
     handleCurrentChange (val) {
       this.page = val
     },
-    // 更改域名
-    async update (row) {
-      await this.$put(this.api.updateSite, {
-        id: row.id,
-        domainName: row.domainName
-      })
-    },
     // 前往网站首页
     toIndex (row) {
       window.open((Setting.isDev ? `http://${location.hostname}:8097` : row.domainName) + `#/column?siteId=${row.id}`)
@@ -104,6 +116,22 @@ export default {
       this.setSite(row)
       this.$router.push(`/column`)
     },
+    // 编辑
+    edit (row) {
+      this.form = {
+        id: row.id,
+        siteName: row.siteName,
+        domainName: row.domainName,
+      }
+      this.siteVisible = true
+    },
+    // 编辑提交
+    async submit () {
+      await this.$put(this.api.updateSite, this.form)
+      this.siteVisible = false
+      Util.successMsg('保存成功')
+      this.getData()
+    },
   }
 };
 </script>