[Dcat 扩展] dcat-distpicker 省市区三级联动选择组件拓展

dcat-distpicker 是一个中国省市区三级联动选择组件,基于 Distpicker 实现的 dcat-admin 扩展,用来将 Distpicker 集成进 dcat-admin的表单中。
如果此插件给你带来的帮助,麻烦给我一个 star。当然如果你在使用过程中发现地区不完整的情况,欢迎随时反馈给我。

最近版本特色

  • 修复一对多下的选择器显示异常 bug
  • 新增支持多层级选择配置
  • 更新 distpicker.js 到 2.0.7
  • 新增支持地区名称回显
  • 兼容 laravel-wherehasin
  • 新增支持筛选时选择框显示 tooltip

截图

image-20200628150204971

安装

首先

# jqhph/dcat-admin 1.x
composer require "super-eggs/dcat-distpicker:^1.0"

# jqhph/dcat-admin 2.x
composer require "super-eggs/dcat-distpicker:^2.0"

然后: (dcat-admin 2.x 无需执行!!!)

php artisan admin:import dcat-distpicker

开启扩展

后台开启

  • dcat-admin 2.x

使用

数据表单中使用

比如在表中有三个字段province_id, city_id, district_id, 在form表单中使用它:

$form->distpicker(['province_id', 'city_id', 'district_id']);

设置默认值

$form->distpicker([
    'province_id' => '省份',
    'city_id' => '市',
    'district_id' => '区'
], '地域选择')->default([
    'province' => 130000,
    'city'     => 130200,
    'district' => 130203,
]);

可以设置每个字段的placeholder

// 省、市、区
$form->distpicker([
    'province_id' => '省',
    'city_id'     => '市',
    'district_id' => '区'
]);
// 省、市 (Available in v2.1.0+)
$form->distpicker([
    'province_id' => '省',
    'city_id'     => '市',
]);
// 只显示省 (Available in v2.1.0+)
$form->distpicker([
    'province_id' => '省',
]);

设置label

$form->distpicker(['province_id', 'city_id', 'district_id'], '请选择区域');

设置自动选择, 可以设置1,2,3 表示自动选择到第几级

$form->distpicker(['province_id', 'city_id', 'district_id'])->autoselect(1);

表格筛选中使用

$filter->distpicker('province_id', 'city_id', 'district_id', '地域选择');

筛选同样支持多级选择:

// 省、市 (Available in v2.1.0+)
$filter->distpicker('province_id', 'city_id','', '地域选择');
//or
$filter->distpicker('province_id', 'city_id');
// 只显示省 (Available in v2.1.0+)
$filter->distpicker('province_id','','', '地域选择');
//or
$filter->distpicker('province_id');

数据表格中使用

省市区名称回显 (Available in v2.1.0+):

$grid->column('province_id')->distpicker();
$grid->column('city_id')->distpicker();
$grid->column('district_id')->distpicker();

并且提供了一个全局可用的辅助函数:

use SuperEggs\DcatDistpicker\DcatDistpickerHelper;

DcatDistpickerHelper::getAreaName($code); // return string

地区编码数据

Distpicker 所使用的地域编码是基于国家统计局发布的数据, 数据字典为china_area.json文件.

鸣谢

由衷感谢以下开源软件、框架等(包括但不限于)

本作品采用《CC 协议》,转载必须注明作者和本文链接
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 5

是我的php版本问题:从 PHP 7.4.0 开始,属性定义可以包含 类型声明 , 但 callable 除外。我把类型声明去掉就好了

3周前 评论
SuperEggs (楼主) 3周前

请问如何应用在API当中

3周前 评论
SuperEggs (楼主) 3周前

还是laraveladmin好用这个装个插件半天不行

13小时前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!