PHP项目学习笔记-萤火商城-增加一个模块(表涉及到的操作和文件)

背景
是在store的后台添加一个页面,显示的如满意度调查的页面

  1. 在router.config.js里面配置一个新的菜单
    路径:yoshop2.0-store\src\config\router.config.js
    代码如下,很简单,定义了这菜单点击的时候进入的页面,和下面的子菜单
{path: '/satisfaction',name: 'satisfaction',component: RouteView,meta: { title: '满意度管理', keepAlive: true, icon: Icons.mpWeixin, iconStyle: { fontSize: '17.2px', color: '#36b313' }, permission: ['/satisfaction'] },//子菜单children: [{//这里定义了后台方法path: '/satisfaction/list',//这里定义了前端页面的路径component: () => import(/* webpackChunkName: "statistics" */ '@/views/satisfaction/index'),meta: { title: '满意度列表', keepAlive: false, permission: ['/satisfaction/list'] },}]
},
  1. 增加前后台文件
    2.1 增加前端文件页面
    创建目录:yoshop2.0-store\src\views\satisfaction
    创建文件:yoshop2.0-store\src\views\satisfaction\index.vue
    内容代码:
<template><a-card :bordered="false"><div class="card-title">{{ $route.meta.title }}</div><div class="table-operator"><!-- 搜索板块 --><a-row class="row-item-search"><a-form class="search-form" :form="searchForm" layout="inline" @submit="handleSearch"><a-form-item label="手机号码"><a-input v-decorator="['satisfaction_userphone']" placeholder="请输入手机号码" /></a-form-item><a-form-item class="search-btn"><a-button type="primary" icon="search" html-type="submit">搜索</a-button></a-form-item></a-form></a-row></div><!-- 表板块 --><s-tableref="table"rowKey="satisfaction_id":loading="isLoading":columns="columns":data="loadData":pageSize="15":scroll="{ x: 1450 }"></s-table></a-card>
</template><script>
import { ContentHeader, STable } from '@/components'
import * as SatisfactionApi from '@/api/satisfaction/index'
// 表格表头
const columns = [{title: 'ID',width: '50px',dataIndex: 'satisfaction_id'},{title: '评价人',dataIndex: 'satisfaction_user',width: '100px',scopedSlots: { customRender: 'satisfaction_user' }},{title: '评价人手机',dataIndex: 'satisfaction_userphone',width: '100px',scopedSlots: { customRender: 'satisfaction_userphone' }},{title: '操作',dataIndex: 'action',width: '150px',fixed: 'right',scopedSlots: { customRender: 'action' }}
]export default {name: 'Index',components: {ContentHeader,STable},data () {return {expand: false,// 表头columns,// 正在加载isLoading: false,queryParam: {},searchForm: this.$form.createForm(this),loadData: param => {return SatisfactionApi.list({ ...param, ...this.queryParam }).then(response => {return response.data.list})}}},methods:{// 确认搜索handleSearch (e) {e.preventDefault()this.searchForm.validateFields((error, values) => {if (!error) {this.queryParam = { ...this.queryParam, ...values }this.handleRefresh(true)}})},/*** 刷新列表* @param Boolean bool 强制刷新到第一页*/handleRefresh (bool = false) {this.$refs.table.refresh(bool)}}
}
</script>

创建对应的目录:yoshop2.0-store\src\api\satisfaction
创建对应的文件:yoshop2.0-store\src\api\satisfaction\index.js
内容代码:

import { axios } from '@/utils/request'/*** api接口列表* /satisfaction/list表示:后台对应的文件目录是app\store\controller下的satisfaction.php,对应的list方法* /satisfaction.satisfaction/list表示:后台对应的文件目录是app\store\controller\satisfaction\下的satisfaction.php,对应的list方法*/
const api = {list: '/satisfaction/list',
}/*** 获取满意度列表*/
export function list (params) {return axios({url: api.list,method: 'get',params})
}

2.2 增加后台PHP文件
增加表对应的基模型:yoshop2.0\app\common\model\Satisfaction.php

<?phpdeclare (strict_types=1);
namespace app\common\model;
use cores\BaseModel;
class Satisfaction extends BaseModel
{// 定义表名protected $name = 'store_satisfaction';// 定义主键protected $pk = 'satisfaction_id';
}?>

增加表对应的具体模型:yoshop2.0\app\store\model\Satisfaction.php

<?phpdeclare (strict_types=1);
namespace app\store\model;
use cores\exception\BaseException;
use app\common\model\Satisfaction as SatisfactionModel;class Satisfaction extends SatisfactionModel
{/*** 隐藏字段,如是查询结果的话,会将设定的字段隐藏掉,这里我希望显示这个两个字段,因此我注释了* @var array*/protected $hidden = ['store_id',
//         'create_time'];public function getList(array $param = []){// 查询参数$params = $this->setQueryDefaultValue($param, ['satisfaction_userphone' => '','store_id' => 10001]);// 检索查询条件$filter = [];!empty($params['satisfaction_userphone']) && $filter[] = ['satisfaction_userphone', 'like', "%{$params['satisfaction_userphone']}%"];// 获取列表数据return $this->where($filter)->order(['create_time' => 'desc'])->paginate(50);}
}
?>

增加controller页面调用的文件:

<?php
declare (strict_types=1);namespace app\store\controller;use app\store\controller\Controller;
use app\store\model\Satisfaction as SatisfactionModel;/*** 满意度控制器* Class article* @package app\store\controller\satisfaction*/
class Satisfaction extends Controller
{public function list(){$model = new SatisfactionModel;$list = $model->getList($this->request->param());return $this->renderSuccess(compact('list'));}
}
?>
  1. 添加如上文件后就能在后台看到对应菜单好和自动读取数据库表的内容管理
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/195217.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Xrdp+内网穿透实现远程访问Linux Kali桌面

XrdpCpolar实现远程访问Linux Kali桌面 文章目录 XrdpCpolar实现远程访问Linux Kali桌面前言1. Kali 安装Xrdp2. 本地远程Kali桌面3. Kali 安装Cpolar 内网穿透4. 配置公网远程地址5. 公网远程Kali桌面连接6. 固定连接公网地址7. 固定地址连接测试 前言 Kali远程桌面的好处在于…

破解tomcat密码并上传webshell

tomcat基础认证爆破 暴力破解 进入vulnhub的tomcat8目录&#xff0c;启动环境 由于tomcat密码默认最大尝试错误次数为5次&#xff0c;需要修改server.xml&#xff0c;修改下面字段 failureCount"10000000000" lockOutTime"0"tomcat默认界面&#xff0c;…

Clickhouse学习笔记(15)—— Clickhouse备份

手动备份 参考官网&#xff1a;Backup and Restore | ClickHouse Docs 简单来说&#xff0c;就是我们可以通过ALTER TABLE ... FREEZE PARTITION ...命令为表分区创建一个本地副本&#xff0c;然后这个副本硬链接到/var/lib/clickhouse/shadow/文件夹&#xff0c;因此其不会耗…

【大话Presto 】- 核心概念

文章目录 前言Operator Model And Iterator Model系统组成Connector数据模型查询执行模型StatementStageTaskSplitDriverOperatorExchangePipeLine 总结 前言 Presto&#xff08;PrestoDB&#xff09;是一个FaceBook开源的分布式MPP SQL引擎&#xff0c;旨在处理大规模数据的查…

Karmada调度器

调度器就像一个发动机&#xff0c;如果没有了发动机输入动力&#xff0c;是无法正常运行的。就像 Kubernetes 的调度器&#xff0c;它会负责根据节点的资源状态、Pod 的运行状态&#xff0c;判断 Pod 是调度到怎样的集群节点上去。对于 Karmada 这样的多云能力的调度器来说&…

APP安全加固怎么做?加固技术、加固方法、加固方案

​ 前面的文章中我们为大家介绍了移动应用安全检测的测试依据、测试方法、和测试内容&#xff0c;本文我们着重分享App安全加固的相关内容。 ​ &#xff08;安全检测内容&#xff09; 通过前面的文章我们知道了app安全检测要去检测哪些内容&#xff0c;发现问题后我们如何去修…

Flutter应用-使用sqflite升级数据库

文章目录 问题描述具体做法代码示例更多条件限制升级 数据库迁移和备份简介数据库迁移数据库备份 问题描述 使用fluttter开发的应用程序发布后&#xff0c;发现数据库有些设计不合理。如何来更新数据库呢&#xff1f; 使用sqflite来处理数据库&#xff0c;但是第一版软件发布后…

竞赛选题 深度学习验证码识别 - 机器视觉 python opencv

文章目录 0 前言1 项目简介2 验证码识别步骤2.1 灰度处理&二值化2.2 去除边框2.3 图像降噪2.4 字符切割2.5 识别 3 基于tensorflow的验证码识别3.1 数据集3.2 基于tf的神经网络训练代码 4 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x…

k8s自定义Endpoint实现内部pod访问外部应用

自定义endpoint实现内部pod访问外部应用 endpoint除了可以暴露pod的IP和端口还可以代理到外部的ip和端口 使用场景 公司业务还还没有完成上云&#xff0c; 一部分云原生的&#xff0c;一部分是实体的 业务上云期间逐步实现上云&#xff0c;保证各个模块之间的解耦性 比如使…

【Android】设置全局标题栏

序言 在做项目的时候&#xff0c;有时候需要一个全局统一的标题栏&#xff0c;保证项目风格的统一&#xff0c;但是如果在每个activity上面都写一遍这个标题栏就很麻烦了&#xff0c;我们经常用的方法就是写个基类Activity&#xff0c;然后当某个Activity需要这个统一的标题栏…

ES Kibana 安装

ES & Kibana 本文基于Docker安装部署使用 Kibana的版本和ElasticSearch的版本&#xff0c;以及IK分词器的版本一一对应 Kibana 安装 安装Kibana # 创建网络 [rootiZ2zeg7mctvft5renx1qvbZ ~]# docker network create --driver bridge --subnet 192.168.0.0/16 --gateway …

2023年软件安装管家目录最新

软件目录 ①【电脑办公】电脑系统&#xff08;直接安装&#xff09;Win7Win8Win10OfficeOffice激活office2003office2007office2010office2013office2016office2019office365office2021wps2021Projectproject2007project2010project2016project2019project2013project2021Visio…

为React Ant-Design Table增加字段设置 | 京东云技术团队

最近做的几个项目经常遇到这样的需求&#xff0c;要在表格上增加一个自定义表格字段设置的功能。就是用户可以自己控制那些列需要展示。 在几个项目里都实现了一遍&#xff0c;每个项目的需求又都有点儿不一样&#xff0c;迭代了很多版&#xff0c;所以抽时间把这个功能封装了…

TCP-Modbus通信过程解析与实例演示

大家好&#xff01;今天我将简要介绍一下如何使用TCP-Modbus方式与信捷PLC&#xff08;XD5E型号&#xff09;进行通讯&#xff0c;并演示整个过程。 TCP-Modbus通信过程解析与实例演示 首先&#xff0c;我们需要在PLC软件中设置相应的IP地址。PLC作为服务器&#xff0c;我们将其…

【2015年数据结构真题】

用单链表保存m个整数&#xff0c;结点的结构为 [data] [link]&#xff0c;且|data|<n(n为正整数)。现要求设计一个时问复杂度尽可能高效的算法&#xff0c;对于链表中 data 的绝对值相等的结点&#xff0c;仅保留第一次出现的结点而删除其余绝对值相等的结点。例如&#xff…

html在线生成二维码(附源码)

文章目录 1.设计来源1.1 主界面1.2 美化功能 2.效果和源码2.1 动态效果2.2 源代码 源码下载 作者&#xff1a;xcLeigh 文章地址&#xff1a;https://blog.csdn.net/weixin_43151418/article/details/134458927 html二维码生成&#xff08;附源码&#xff09;&#xff0c;生成二…

UniPro提高集成能力 让客户专注于交付价值

一千个哈姆莱特就有一千个读者&#xff0c;一千个开发团队&#xff0c;也会有各不相同的软件工具和工作流程。工具与工具之间&#xff0c;功能上的割裂亦或重叠&#xff0c;都会给企业和团队的协作带来阻塞&#xff0c;结果就会导致团队之间各自为战、信息孤岛的形成以及资源的…

WPF下实现拖动任意地方都可以拖动窗口

首先在xaml中添加事件 <Window PreviewMouseLeftButtonDown"Window_PreviewMouseLeftButtonDown"PreviewMouseMove"Window_PreviewMouseMove"PreviewMouseLeftButtonUp"Window_PreviewMouseLeftButtonUp"/>然后脚本输入 Point _pressedP…

vscode设置latex

vscode配置latex 1.安装vscode,并添加环境变量路径 2.安装latex,bin文件夹添加到环境变量路径 3.vscode安装插件 4.vscode->文件->首选项->显示配置内容->setting.json文件&#xff0c;查看其位置目录&#xff0c;通过我的电脑找到此文件&#xff08;不要使用v…