From fd7c0fabf0ad61627829e43db95356b0800d9c8e Mon Sep 17 00:00:00 2001 From: bicey Date: Mon, 20 May 2024 15:25:19 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BC=96=E5=86=99=E9=A5=B2=E5=85=BB=E8=AE=A1?= =?UTF-8?q?=E5=88=92=E5=89=8D=E7=AB=AF=E5=9F=BA=E6=9C=AC=E7=95=8C=E9=9D=A2?= =?UTF-8?q?=E3=80=81=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 4 +- src/pages/ZooAnimal.vue | 16 +- src/pages/ZooBreeding.vue | 337 +++++++++++++++++++------------------- src/pages/ZooUser.vue | 9 +- src/store/index.js | 4 +- src/utils/common.js | 37 +++++ 6 files changed, 223 insertions(+), 184 deletions(-) diff --git a/README.md b/README.md index 7a33577..6fb397c 100644 --- a/README.md +++ b/README.md @@ -110,7 +110,7 @@ breedingPlan: { name: '',//字符 饲养计划名称 species: '',//字符 种类 sex: '雄性',//字符 饲养动物性别 - phase: '',//字符 饲养动物阶段：幼年期、成长期、成年期、老年期 + phase: '',//字符 饲养动物生长阶段：幼年期、成长期、成年期、老年期 state: 0,//int 状态（0正常 1异常） describe: ''//字符 饲养计划的描述 } @@ -193,7 +193,7 @@ breedingPlan: { ### 饲养员 -- [ ] 数据展示 +- [x] 数据展示 - [ ] 基本功能 - [ ] 基本方法 - [ ] 接入后端 diff --git a/src/pages/ZooAnimal.vue b/src/pages/ZooAnimal.vue index c8a4402..7011b50 100644 --- a/src/pages/ZooAnimal.vue +++ b/src/pages/ZooAnimal.vue @@ -52,7 +52,7 @@ export default { showEditDialog(animal) { //这里使用animal的id查询后端的特定动物再赋值，这里用假数据代替一下 this.dialog.editData = this.animals.find(e => e.id === animal.id) - console.log('点击了编辑', this.dialog.editData) + console.log('点击了动物编辑', this.dialog.editData) this.dialog.editDialogVisible = true }, // 判断表单是否为空 @@ -86,7 +86,7 @@ export default { // 此处重新拉取数据 this.dialog.editDialogVisible = false//添加成功关闭窗口 }, - deleteUser(animal) { + deleteAnimal(animal) { console.log('删除动物', animal) return ElMessageBox.confirm( '该操作不可撤销，是否继续？', @@ -180,7 +180,7 @@ export default {
- - + + diff --git a/src/pages/ZooBreeding.vue b/src/pages/ZooBreeding.vue index 763af72..39b3bfd 100644 --- a/src/pages/ZooBreeding.vue +++ b/src/pages/ZooBreeding.vue @@ -2,7 +2,7 @@ import ZooBreedingPlanFormDialog from "@/components/ZooBreedingPlanFormDialog.vue"; import {mapState,mapActions} from "vuex"; import {Delete, DocumentAdd, Edit, Search} from "@element-plus/icons-vue"; -import {copy} from "@/utils/common.js"; +import {copy, splitKeyWords,fuzzyMatching} from "@/utils/common.js"; export default { name: "ZooBreeding", @@ -11,8 +11,8 @@ export default { return { tableData: [], searchInput: { - // state: '',//状态（0正常 1异常） - // keyword: '' + state: '',//状态（0正常 1异常） + keyword: '' }, dialog: { addDialogVisible: false,//添加动物对话框 @@ -40,76 +40,77 @@ export default { ...mapState(["breedingPlans"]) }, watch: { - // searchInput: { - // deep: true, - // handler(val) { - // this.searchAnimal(); - // } - // } + searchInput: { + deep: true, + handler(val) { + this.searchBreedingPlan(); + } + } }, methods: { ...mapActions(["getBreedingPlans"]), - // showEditDialog(animal) { - // //这里使用animal的id查询后端的特定动物再赋值，这里用假数据代替一下 - // this.dialog.editData = this.animals.find(e => e.id === animal.id) - // console.log('点击了编辑', this.dialog.editData) - // this.dialog.editDialogVisible = true - // }, - // // 判断表单是否为空 - // isEmpty(form) { - // if (!form.name) { - // //返回提示 - // return ElMessage({ - // message: '动物名不能为空', - // type: 'warning', - // }) - // } - // }, - // editAnimal(form) { - // console.log('确认编辑动物', form) - // //判断是否为空 - // return this.isEmpty(form); - // //编辑失败 - // if (false) { - // return ElMessage({ - // message: '编辑失败', - // type: 'warning', - // }) - // } - // //编辑成功 - // if (false) { - // return ElMessage({ - // message: '编辑成功', - // type: 'success', - // }) - // } - // // 此处重新拉取数据 - // this.dialog.editDialogVisible = false//添加成功关闭窗口 - // }, - // deleteUser(animal) { - // console.log('删除动物', animal) - // return ElMessageBox.confirm( - // '该操作不可撤销，是否继续？', - // '删除动物：' + animal.name, - // { - // confirmButtonText: '确定', - // cancelButtonText: '取消', - // type: 'warning', - // } - // ).then(() => { - // //进行删除操作 - // // …… - // ElMessage({ - // type: 'success', - // message: '删除成功', - // }) - // }).catch(() => { - // ElMessage({ - // type: 'info', - // message: '取消删除', - // }) - // }) - // }, + showEditDialog(breedingPlan) { + //这里使用animal的id查询后端的特定动物再赋值，这里用假数据代替一下 + this.dialog.editData = this.breedingPlans.find(e => e.id === breedingPlan.id) + console.log('点击了编辑', this.dialog.editData) + this.dialog.editDialogVisible = true + }, + // 判断表单是否为空 + isEmpty(form) { + if (!form.name) { + //返回提示 + return ElMessage({ + message: '计划名不能为空', + type: 'warning', + }) + } + }, + editBreedingPlan(form) { + console.log('确认编辑饲养计划', form) + //判断是否为空 + return this.isEmpty(form); + //编辑失败 + if (false) { + return ElMessage({ + message: '编辑失败', + type: 'warning', + }) + } + //编辑成功 + if (false) { + return ElMessage({ + message: '编辑成功', + type: 'success', + }) + } + // 此处重新拉取数据 + this.getBreedingPlans() + this.dialog.editDialogVisible = false//添加成功关闭窗口 + }, + deleteBreedingPlan(breedingPlan) { + console.log('删除动物', breedingPlan) + return ElMessageBox.confirm( + '该操作不可撤销，是否继续？', + '删除饲养计划：' + breedingPlan.name, + { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + } + ).then(() => { + //进行删除操作 + // …… + ElMessage({ + type: 'success', + message: '删除成功', + }) + }).catch(() => { + ElMessage({ + type: 'info', + message: '取消删除', + }) + }) + }, addBreedingPlan(form) { console.log('添加饲养计划', form) //验证是否为空 @@ -131,37 +132,37 @@ export default { // 此处重新拉取数据 this.dialog.addDialogVisible = false//添加成功关闭窗口 }, - // searchAnimal() { - // console.log('动物搜索', this.searchInput) - // let searchResult = []//搜索结果数组 - // //第一步匹配搜索选项，如果选择了特定用户身份 - // if (typeof this.searchInput.state === 'number') { - // this.animals.forEach(e => { - // if (e.state === this.searchInput.state) { - // searchResult.push(copy(e))//如果符合特定权限，则添加到搜索结果 - // } - // }) - // } else { //如果没有选择特定用户身份，代表所有数据都需要参加到下一轮的模糊搜索 - // searchResult = copy(this.animals) - // } - // - // let searchResult2 = [] - // let keyset = splitKeyWords(this.searchInput.keyword)//切割关键字 - // - // //第二步进行模糊搜索 - // searchResult.forEach(e => { - // //如果该对象能匹配上所有关键字，则添加到结果 - // // console.log('开始进行模糊匹配,对象、关键字集合分别为',e,keyset) - // let is = fuzzyMatching(e, keyset); - // if (is) { - // searchResult2.push(e) - // } - // // console.log('结束模糊匹配，结果为',e,keyset,is) - // }) - // searchResult = searchResult2 - // - // this.tableData = searchResult - // }, + searchBreedingPlan() { + console.log('饲养计划搜索', this.searchInput) + let searchResult = []//搜索结果数组 + //第一步匹配搜索选项，如果选择了特定用户身份 + if (typeof this.searchInput.state === 'number') { + this.breedingPlans.forEach(e => { + if (e.state === this.searchInput.state) { + searchResult.push(copy(e))//如果符合特定权限，则添加到搜索结果 + } + }) + } else { //如果没有选择特定用户身份，代表所有数据都需要参加到下一轮的模糊搜索 + searchResult = copy(this.breedingPlans) + } + + let searchResult2 = [] + let keyset = splitKeyWords(this.searchInput.keyword)//切割关键字 + + //第二步进行模糊搜索 + searchResult.forEach(e => { + //如果该对象能匹配上所有关键字，则添加到结果 + // console.log('开始进行模糊匹配,对象、关键字集合分别为',e,keyset) + let is = fuzzyMatching(e, keyset); + if (is) { + searchResult2.push(e) + } + // console.log('结束模糊匹配，结果为',e,keyset,is) + }) + searchResult = searchResult2 + + this.tableData = searchResult + }, }, mounted() { this.getBreedingPlans() @@ -176,63 +177,61 @@ export default {
添加饲养计划
- - - - - - - - - - - - - - - - - - +
+ + + + +
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + +
+ + + + + + + + + + + + + + +
@@ -249,20 +248,20 @@ export default { - - - - - - - - - - - - - - + + + + + +