new

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

@@ -0,0 +1,46 @@
+import request from '@/utils/request'
+
+/* 获取信息列表 */
+export function getMessage() {
+  return request({
+    url: '/showMessage',
+    method: 'get'
+  })
+}
+
+/* 添加信息列表 */
+export function addMessage(data) {
+  return request({
+    url: '/insertAllMessage',
+    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 updateInfo(data) {
+  return request({
+    url: '/updateMessage',
+    method: 'post',
+    data
+  })
+}

vue-admin-template-master/src/router/index.js

@@ -115,6 +115,25 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/message',
+    component: Layout,
+    meta: { title: 'Message', icon: 'level' },
+    children: [
+      {
+        path: 'messageList',
+        name: 'messageList',
+        component: () => import('@/views/message/messageList'),
+        meta: { title: '信息列表', icon: 'level' }
+      },
+      {
+        path: 'addMessage',
+        name: 'addMessage',
+        component: () => import('@/views/message/addMessage'),
+        meta: { title: '添加信息', icon: 'level' }
+      }
+    ]
+  },
 
   {
     path: '/form',

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

@@ -0,0 +1,189 @@
+/* 
+  添加信息
+  author:zsy
+  date:2023-08-02
+ */
+<template>
+  <div class="add-message">
+    <el-form
+      :model="ruleForm"
+      :rules="rules"
+      ref="ruleForm"
+      label-width="100px"
+      class="demo-ruleForm"
+    >
+      <el-form-item label="用户名称" prop="uname">
+        <el-input v-model="ruleForm.uname"></el-input>
+      </el-form-item>
+      <el-form-item label="地址ID" prop="addressid">
+        <el-select v-model="ruleForm.addressid" placeholder="地址">
+          <el-option
+            v-for="item in addressData"
+            :key="item.addressid"
+            :label="item.addressname"
+            :value="item.addressid"
+          >
+          </el-option>
+        </el-select>
+        <!-- <el-input v-model="ruleForm.addressid"></el-input> -->
+      </el-form-item>
+      <el-form-item label="等级ID" prop="levelid">
+        <el-select v-model="ruleForm.levelid" placeholder="等级">
+          <el-option
+            v-for="item in levelData"
+            :key="item.jrid"
+            :label="item.levelname"
+            :value="item.jrid"
+          >
+          </el-option>
+        </el-select>
+        <!-- <el-input v-model="ruleForm.latitude"></el-input> -->
+      </el-form-item>
+      <el-form-item label="电话号码" prop="tel">
+        <el-input v-model="ruleForm.tel"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <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>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import {getLocation} from '@/api/location'
+import {getLevel} from '@/api/level'
+import {addMessage , showMessage ,updateInfo} from '@/api/message'
+export default {
+  data() {
+    return {
+      isUpdate: false,
+      ruleForm: {
+        uname: "",
+        addressid: "",
+        levelid: "",
+        tel: "",
+      },
+      addressData:[],
+      levelData:[],
+      rules: {
+        uname: [{ required: true, message: "请输入用户名称", trigger: "blur" }],
+        tel: [{ required: true, message: "请输入电话号", trigger: "blur" }],
+        addressid: [{ required: true, message: "请输入地址", trigger: "blur" }],
+        levelid: [{ required: true, message: "请输入等级", trigger: "blur" }],
+      },
+    };
+  },
+  methods: {
+    /* /获取地址列表 */
+    getLocationList(){
+      getLocation().then((res)=>{
+        this.addressData = res.data
+      })
+    },
+    /* 获取等级列表 */
+    getLevelList(){
+      getLevel().then((res)=>{
+        this.levelData = res.data
+      })
+    },
+    /* 提交功能 */
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          addMessage({
+            uname: this.ruleForm.uname,
+            addressid: this.ruleForm.addressid,
+            levelid: this.ruleForm.levelid,
+            tel: this.ruleForm.tel
+          })
+            .then((res) => {
+              this.$message({
+                message: "提交成功",
+                type: "success",
+              });
+              this.$refs[formName].resetFields();
+              this.$router.push('/message/messageList')
+            })
+            .catch((err) => {
+              console.log(err);
+            });
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    /* 重置 */
+    resetForm(formName) {
+      this.$refs[formName].resetFields();
+    },
+    /* 根据id获取信息 */
+    showMessageList(id){
+      showMessage({
+        id: id
+      }).then((res)=>{
+        console.log(res.data[0])
+        this.ruleForm = res.data[0]
+        this.ruleForm = {
+          uname: res.data[0].jrname,
+          addressid: res.data[0].jraddressesid,
+          levelid: res.data[0].jrlevel,
+          tel: res.data[0].jrtel
+        }
+      }).catch((err)=>{
+        console.log(err)
+      })
+    },
+    /* 修改功能 */
+    updateForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          updateInfo({
+            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({
+                message: "提交成功",
+                type: "success",
+              });
+              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(); 
+    if(this.$route.query.id){
+      this.isUpdate = true
+      let _id = this.$route.query.id 
+      this.showMessageList(_id)
+    }
+  }
+};
+</script>
+
+<style scoped>
+.add-message {
+  width: 70%;
+  margin: 100px auto 0;
+}
+</style>

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

@@ -0,0 +1,106 @@
+/* 
+  信息列表
+  author:zsy
+  date: 2023-08-02
+ */
+<template>
+  <div class="message-list">
+    
+    <el-table :data="tableData" style="width: 100%">
+      <el-table-column prop="jrid" label="信息ID"> </el-table-column>
+      <el-table-column prop="jraddressesid" label="地址ID"> </el-table-column>
+      <el-table-column prop="jrname" label="姓名"> </el-table-column>
+      <el-table-column prop="jrlevel" label="等级ID"> </el-table-column>
+      <el-table-column prop="jrid" label="信息ID"> </el-table-column>
+      <el-table-column prop="jrtel" label="电话号码"> </el-table-column>
+      <el-table-column prop="levelname" label="等级名称"> </el-table-column>
+      <el-table-column prop="addressname" label="地址名称"> </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"
+            size="small"
+          >
+            移除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+import {getMessage , delMessage} from '@/api/message'
+export default {
+  data(){
+    return{
+      tableData:[]
+    }
+  },
+  methods: {
+    /* 获取信息列表 */
+    getMessageList(){
+      getMessage().then((res)=>{
+        this.tableData = res.data
+      })
+    },
+    /* 移除等级 */
+    deleteRow(row) {
+      console.log(row.addressid);
+      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          delMessage({
+            id: row.jrid,
+          }).then((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()
+  }
+};
+</script>
+
+<style scoped>
+.message-list{
+  width: 90%;
+  margin: 100px auto 0
+}
+</style>