From c6fae04a5b0854875033d6ca7de334823dc7f343 Mon Sep 17 00:00:00 2001 From: milo <315045773@qq.com> Date: Sat, 2 Apr 2022 15:25:25 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=A2=E6=88=B7=E6=96=B0=E5=A2=9E=E5=92=8C?= =?UTF-8?q?=E7=BC=96=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/customerAdd.ts | 4 + src/api/customerEdit.ts | 4 + src/views/Customer.vue | 179 +++++++++++++++++++++++++++++----------- 3 files changed, 138 insertions(+), 49 deletions(-) create mode 100644 src/api/customerAdd.ts create mode 100644 src/api/customerEdit.ts diff --git a/src/api/customerAdd.ts b/src/api/customerAdd.ts new file mode 100644 index 0000000..409918f --- /dev/null +++ b/src/api/customerAdd.ts @@ -0,0 +1,4 @@ +import axios from 'axios' +import qs from 'qs' + +export const customerAdd = query => axios.post('http://oa-dxtc.test/customer/add', qs.stringify(query)); diff --git a/src/api/customerEdit.ts b/src/api/customerEdit.ts new file mode 100644 index 0000000..efe84c5 --- /dev/null +++ b/src/api/customerEdit.ts @@ -0,0 +1,4 @@ +import axios from 'axios' +import qs from 'qs' + +export const customerEdit = query => axios.post('http://oa-dxtc.test/customer/edit', qs.stringify(query)); diff --git a/src/views/Customer.vue b/src/views/Customer.vue index b41a865..4b335dc 100644 --- a/src/views/Customer.vue +++ b/src/views/Customer.vue @@ -5,8 +5,8 @@ 客户列表 - - + + @@ -22,36 +22,22 @@ - - - - - - - - - - - - - + + + + + + @@ -62,13 +48,19 @@ - - - - + + + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -85,6 +101,8 @@ import { ref, reactive } from "vue"; import { ElMessage, ElMessageBox } from "element-plus"; import { customerData } from "../api/customer"; +import { customerAdd } from "../api/customerAdd"; +import { customerEdit } from '../api/customerEdit'; export default { name: "basetable", @@ -100,9 +118,8 @@ export default { // 获取表格数据 const getData = () => { customerData(query).then((res) => { - console.log(res); - //tableData.value = res.data; - //pageTotal.value = res.pageTotal || 0; + tableData.value = res.data.data; + pageTotal.value = res.data.pageTotal || 0; }); }; getData(); @@ -130,40 +147,104 @@ export default { }) .catch(() => {}); }; - + const user = JSON.parse(localStorage.getItem('user')); // 表格编辑时弹窗和保存 const editVisible = ref(false); - let form = reactive({ - name: "", - address: "", + const tableEditData = ref(null); + const editForm = reactive({ + company:'', + name:'', + telephone:'', + wechat:'', + userid:user.id, + id:0 }); let idx = -1; const handleEdit = (index, row) => { idx = index; - Object.keys(form).forEach((item) => { - form[item] = row[item]; + Object.keys(editForm).forEach((item) => { + editForm[item] = row[item]; }); editVisible.value = true; }; const saveEdit = () => { - editVisible.value = false; - ElMessage.success(`修改第 ${idx + 1} 行成功`); - Object.keys(form).forEach((item) => { - tableData.value[idx][item] = form[item]; + tableEditData.value.validate((valid) => { + if(!valid){ + ElMessage.error('验证失败'); + return false; + } + customerEdit(editForm).then((res) => { + if(res.data.code == 0){ + ElMessage.success(`修改第 ${idx + 1} 行成功`); + editVisible.value = false; + }else{ + ElMessage.error(res.data.msg); + return false; + } + }); + }); + }; + + //新增 + const addVisible = ref(false); + const rules = reactive({ + company: [ + { required: true, message: "请输入公司名", trigger: "blur"}, + ], + name: [ + { required: true, message: "联系人姓名", trigger: "blur" }, + ], + telephone:[ + { required: true, message: "联系人电话", trigger: "blur" }, + ] + }); + const tableAddData = ref(null); + const addForm = reactive({ + company:'', + name:'', + telephone:'', + wechat:'', + userid:user.id + }); + const handleAdd = () => { + addVisible.value = true; + }; + const saveAdd = () => { + tableAddData.value.validate((valid) => { + if(!valid){ + ElMessage.error('验证失败'); + return false; + } + customerAdd(addForm).then((res) => { + if(res.data.code == 0){ + ElMessage.success("添加成功"); + addVisible.value = false; + }else{ + ElMessage.error(res.data.msg); + return false; + } + }); }); }; return { query, tableData, + tableAddData, + tableEditData, pageTotal, editVisible, - form, + addVisible, + editForm, + addForm, handleSearch, handlePageChange, handleDelete, handleEdit, + handleAdd, saveEdit, + saveAdd, + rules, }; }, };