new

vue-admin-template-master/src/api/message.js

@@ -15,4 +15,30 @@ export function addMessage(data) {
     method: 'post',
     data
   })
+}
+
+//删除信息列表
+export function delMessage(params) {
+  return request({
+    url: '/delOneMessage',
+    method: 'get',
+    params
+  })
+}
+//根据id获取信息
+export function showMessage(params) {
+  return request({
+    url: '/showOneMessage',
+    method: 'get',
+    params
+  })
+}
+
+//更新信息
+export function upMessage(data) {
+  return request({
+    url: '/updateMessage',
+    method: 'post',
+    data
+  })
 }

vue-admin-template-master/src/views/message/addMessage.vue

@@ -56,7 +56,10 @@
       </el-form-item> -->
 
       <el-form-item>
-        <el-button type="primary" @click="submitForm('ruleForm')"
+        <el-button type="primary" @click="updateForm('ruleForm')" v-if="isUpdate"
+          >修改</el-button
+        >
+        <el-button type="primary" @click="submitForm('ruleForm')" v-else
           >提交</el-button
         >
         <el-button @click="resetForm('ruleForm')">重置</el-button>
@@ -68,10 +71,11 @@
 <script>
 import { getLocation } from "@/api/location";
 import { getLevel } from "@/api/level";
-import {addMessage} from '@/api/message'
+import {addMessage,showMessage,upMessage} from '@/api/message'
 export default {
   data() {
     return {
+      isUpdate:false,
       ruleForm: {
         uname: "",
         addressid: "",
@@ -132,10 +136,64 @@ export default {
     resetForm(formName) {
       this.$refs[formName].resetFields();
     },
+    //根据id获取信息
+    showMessageList(id){
+      console.log(id)
+      showMessage({
+        id: id
+      }).then((res)=>{
+        console.log(res.data[0])
+        // this.ruleForm = res.data[0]
+        let _data = res.data[0]
+        this.ruleForm = {
+          uname: _data.jrname,
+          addressid: _data.jraddressesid,
+          levelid: _data.jrlevel,
+          tel: _data.jrtel
+        }
+      }).catch((err)=>{
+        console.log(err)
+      })
+    },
+    //修改信息
+    updateForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          upMessage({
+            id: this.$route.query.id,
+            uname: this.ruleForm.uname,
+            addressid: this.ruleForm.addressid,
+            levelid: this.ruleForm.levelid,
+            tel: this.ruleForm.tel,
+          })
+            .then((res) => {
+              this.$message({
+                type: "success",
+                message: res.message,
+              });
+              this.$refs[formName].resetFields();
+              this.$router.push("/message/messageList");
+            })
+            .catch((err) => {
+              console.log(err);
+            });
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    }
   },
   created() {
     this.getLocationList();
     this.getLevelList();
+    this.showMessageList()
+    // console.log(this.$route.query.id)
+    if(this.$route.query.id){
+      let _id = this.$route.query.id
+      this.showMessageList(_id),
+      this.isUpdate = true
+    }
   },
 };
 </script>

vue-admin-template-master/src/views/message/messageList.vue

@@ -20,6 +20,13 @@
       </el-table-column>
       <el-table-column fixed="right" label="操作" width="120">
         <template slot-scope="scope">
+          <el-button
+            @click.native.prevent="updateRow(scope.row)"
+            type="text"
+            size="small"
+          >
+            修改
+          </el-button>
           <el-button
             @click.native.prevent="deleteRow(scope.row)"
             type="text"
@@ -34,24 +41,65 @@
 </template>
 
 <script>
-import {getMessage} from '@/api/message'
+import { getMessage, delMessage } from "@/api/message";
 export default {
   data() {
     return {
       tableData: [],
     };
   },
-  methods:{
+  methods: {
     //获取信息列表
-    getMessageList(){
-      getMessage().then((res)=>{
-        this.tableData = res.data
+    getMessageList() {
+      getMessage().then((res) => {
+        this.tableData = res.data;
+      });
+    },
+    //删除信息
+    deleteRow(row) {
+      console.log(row.jrid);
+      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          delMessage({
+            id: row.jrid,
+          })
+            .then((res) => {
+              console.log(res);
+              this.$message({
+                type: "success",
+                message: "删除成功!",
+              });
+              this.getMessageList();
+            })
+            .catch((err) => {
+              console.log(err);
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    //修改信息
+    updateRow(row){
+      console.log(row)
+      this.$router.push({
+        path:"/message/addMessage",
+        query:{
+          id:row.jrid
+        }
       })
     }
   },
-  created(){
-    this.getMessageList()
-  }
+  created() {
+    this.getMessageList();
+  },
 };
 </script>