thinkphp5 fastafmin 前端笔记

网友投稿 514 2022-11-27

thinkphp5 fastafmin 前端笔记

fastafmin笔记

菜单手动生成的一级菜单下的二级菜单如果不是菜单会无法显示

控制器

public function _initialize() { parent::_initialize(); $this->model = model('AppointmentActivity'); //查询场馆列表 $venue_model = model('Venue'); $venue_list = $venue_model->select(); $venue_list = Collection($venue_list)->toArray(); $this->view->assign("venueList", $venue_list); $this->view->assign("isListList", $this->model->getIsListList()); }

html

编辑

lang 语言{:__('Venue_name')} ,在语言模板中找到添加即可

ajax请求后台数据 并将数据写入前端

api: { bindevent: function (data, ret) { $(document).on("change", "#c-type", function (e) { var value = e.target.value; $.ajax({ url: "appointmentorder/appointmentorder/re_appointment_list", type: 'post', dataType: 'json', data: {value: value}, success: function (ret) { console.log(ret); var result = ''; for (var i=0; i< ret.length; i++) { var item = ret[i]; result += ""; }; $("#c-pid").empty().append(result); $("#c-pid").selectpicker("refresh"); }, error: function (e) { Backend.api.toastr.error(e.message); } }); }); Form.api.bindevent($("form[role=form]")); } }

前端下拉框显示

后台富文本字段选text 开启富文本插件,,输入命令生成curl

时间弹窗不能完全显示 修改css

backend.css.tab-addtabs { /*overflow: hidden;*/}

和 bootstrap.css和fastadmin.min.css增加

.content { min-height: 250px; padding: 15px; margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; padding-bottom:50px;}

搜索联表处理

表 couponuser,coupon和user表

关联字段分别是c_id和user_id

对应的js

// 初始化表格 table.bootstrapTable({ url: $.fn.bootstrapTable.defaults.extend.index_url, pk: 'id', sortName: 'id', columns: [ [ {checkbox: true}, {field: 'id', title: __('Num_id')}, {field: 'coupon.name', title: __('couponuser_list')}, {field: 'user.nickname', title: __('user_name')}, {field: 'coupon', title: __('Coupon')}, {field: 'is_receivelist', title: __('Is_receivelist'),operate:false, visible:false, searchList: {"0":__('Is_receivelist 0'),"1":__('Is_receivelist 1')}}, {field: 'is_receivelist_text', title: __('Is_receivelist'), operate:false}, {field: 'is_use', title: __('Is_use'), visible:false, searchList: {"0":__('Is_use 0'),"1":__('Is_use 1')}}, {field: 'is_use_text', title: __('Is_use'), operate:false}, {field: 'imagesurl', title: __('Images'),operate:false, formatter: Table.api.formatter.images}, {field: 'createtime', title: __('Createtime'), operate:'RANGE', addclass:'datetimerange', formatter: Table.api.formatter.datetime}, {field: 'updatetime', title: __('Updatetime'), operate:'RANGE', addclass:'datetimerange', formatter: Table.api.formatter.datetime}, {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate} ] ] });

model(在当期的model)

public function Coupon() {// return $this->hasOne('Coupon', 'id', 'c_id'); return $this->belongsTo('Coupon', 'c_id', 'id', [], 'LEFT')->field('name')->setEagerlyType(0); } public function User() {// return $this->hasOne('Coupon', 'id', 'c_id'); return $this->belongsTo('User', 'user_id', 'id', [], 'LEFT')->field('nickname')->setEagerlyType(0); }

控制器

/** * 查看 */ public function index() { //设置过滤方法 $this->request->filter(['strip_tags']); if ($this->request->isAjax()) { //如果发送的来源是Selectpage,则转发到Selectpage if ($this->request->request('keyField')) { return $this->selectpage(); } list($where, $sort, $order, $offset, $limit) = $this->buildparams(); $total = $this->model ->with(['coupon']) ->with(['user']) ->where($where)// ->order($sort, $order) ->count(); $result = $this->model ->with(['coupon','user']) ->where($where) ->order('coupon_user.'.$sort, $order) ->limit($offset, $limit) ->select(); $result = collection($result)->toArray(); $host_url = ". $_SERVER['HTTP_HOST'] . "/"; foreach ($result as $k => $v) { $imagesurl = $host_url . $v['images']; $result[$k]['imagesurl'] = $imagesurl; $coupon = model('Coupon')->where('id', $v['c_id'])->select(); $coupon = collection($coupon)->toArray(); foreach ($coupon as $kk => $vv) { $result[$k]['name'] = $vv['name']; } //获取用户名称 $user_list = model('User')->where('id', $v['user_id'])->select(); $user_list = collection($user_list)->toArray(); foreach ($user_list as $key => $value) { $result[$k]['nickname'] = $value['nickname']; } } $result = array("total" => $total, "rows" => $result); return $result;// return json($result); } return $this->view->fetch(); }

给页面添加一个新页面传递参数

在当前页面js中替换下面的js

// {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}, //操作栏,默认有编辑、删除或排序按钮,可自定义配置buttons来扩展按钮 { field: 'operate', width: "120px", title: __('Operate'), table: table, events: Table.api.events.operate, buttons: [ { name: 'addtabs', title: __('企业联系人列表'), classname: 'btn btn-xs btn-warning btn-addtabs', icon: 'fa fa-folder-o', url: 'contact/index/' }, ], formatter: Table.api.formatter.operate },

创建对应的控制器/前端也面/js(复制一个即可)

主要说说怎么传值(将id传值过去,返回前端页面,js抓取标识后通过ajax在次请求接口,接口返回参数即可)

代码

index方法,通过传递的id查询返回数据到新页面

/** * 查看 */ public function index($ids = '') { //设置过滤方法 $this->request->filter(['strip_tags']); if ($this->request->isAjax()) { //如果发送的来源是Selectpage,则转发到Selectpage if ($this->request->request('keyField')) { return $this->selectpage(); } list($where, $sort, $order, $offset, $limit) = $this->buildparams(); $total = $this->model ->where($where) ->where(["enterprise_id" => $ids]) ->order($sort, $order) ->count(); $list = $this->model ->where($where) ->where(["enterprise_id" => $ids]) ->order($sort, $order) ->limit($offset, $limit) ->select(); $list = collection($list)->toArray(); $result = array("total" => $total, "rows" => $list); return json($result); } $this->assign("ids",$ids); return $this->view->fetch(); }

index.html页面加一个

js里面获取并传参

index: function () { // 初始化表格参数配置 var ids = $('#ids').val();//获取ids Table.api.init({ extend: { index_url: 'contact/index/ids/'+ids, add_url: 'contact/add', edit_url: 'contact/edit', del_url: 'contact/del', multi_url: 'contact/multi', table: 'contacts', } });

最合理的一种

html

js

var Controller = { index: function () { // 初始化表格参数配置 var equid = $('#equid').val();//获取ids Table.api.init({ extend: { index_url: 'switchs/index/?equid='+equid, add_url: 'switchs/add', edit_url: '', del_url: '', multi_url: '', table: 'switchs', } });

后台接收

$equid = $this->request->get('equid');

163邮箱配置

直接通过命令行生成表例如表articles 则联表地方写上articles_id即可

生成关联id

在html中add.html和edit.html中添加data-field="显示的字段" data-order-by="id desc"控制`排序

官方方法

electpage所支持的扩展属性

属性

功能

示例

data-source

提供数据源的URL地址

data-source="category/index"

data-field

列表显示读取的字段

data-field="username"

data-primary-key

列表选中后渲染的字段

data-primary-key="uid"

data-pagination

是否开启分页

data-pagination="true"

data-page-size

分页大小

data-page-size="10"

data-multiple

是否支持多选

data-multiple="true"

data-max-select-limit

最多可选择数量

data-max-select-limit="3"

data-order-by

排序字段

data-order-by="id"

data-params

自定义扩展参数

data-params='{"custom[type]":"test"}'

data-select-only

是否为只读模式

data-select-only="true"

 

articles/inde 地址是对应控制的index方法

js引入地址 admin/view/common/mete.html 引入方法