From d4020b93a397eff0471efebe781b361c5ae811af Mon Sep 17 00:00:00 2001 From: JaguarJack Date: Mon, 29 Mar 2021 19:52:01 +0800 Subject: [PATCH] =?UTF-8?q?add:=E6=96=B0=E5=A2=9Etable=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- extend/catcher/library/table/Actions.php | 100 +++++ .../catcher/library/table/ComponentsTrait.php | 67 +++ .../library/table/DynamicFormFields.php | 383 ++++++++++++++++++ extend/catcher/library/table/Events.php | 20 + extend/catcher/library/table/HeaderItem.php | 83 ++++ extend/catcher/library/table/Search.php | 106 +++++ extend/catcher/library/table/Table.php | 379 +++++++++++++++++ .../library/table/components/Button.php | 36 ++ .../library/table/components/Component.php | 43 ++ 9 files changed, 1217 insertions(+) create mode 100644 extend/catcher/library/table/Actions.php create mode 100644 extend/catcher/library/table/ComponentsTrait.php create mode 100644 extend/catcher/library/table/DynamicFormFields.php create mode 100644 extend/catcher/library/table/Events.php create mode 100644 extend/catcher/library/table/HeaderItem.php create mode 100644 extend/catcher/library/table/Search.php create mode 100644 extend/catcher/library/table/Table.php create mode 100644 extend/catcher/library/table/components/Button.php create mode 100644 extend/catcher/library/table/components/Component.php diff --git a/extend/catcher/library/table/Actions.php b/extend/catcher/library/table/Actions.php new file mode 100644 index 0000000..1e582e4 --- /dev/null +++ b/extend/catcher/library/table/Actions.php @@ -0,0 +1,100 @@ +icon('el-icon-plus') + ->text($text) + ->type('primary') + ->size('mini') + ->click($event); + } + + /** + * 更新按钮 + * + * @time 2021年03月23日 + * @param string $text + * @param string $event + * @return mixed + */ + public static function update(string $text = '更新', string $event = 'handleUpdate') + { + return (new Button)->icon('el-icon-edit') + ->text($text) + ->size('mini') + ->type('primary') + ->click($event); + } + + /** + * 删除按钮 + * + * @time 2021年03月23日 + * @param string $text + * @param string $event + * @return mixed + */ + public static function delete(string $text = '删除', string $event = 'handleDel') + { + return (new Button)->icon('el-icon-delete') + ->text($text)->type('danger') + ->size('mini') + ->click($event); + } + + /** + * 查询按钮 + * + * @time 2021年03月23日 + * @param string $text + * @param string $event + * @return mixed + */ + public static function view(string $text = '查看', string $event = null) + { + $button = (new Button)->icon('el-icon-eye') + ->size('mini') + ->text($text); + + if ($event) { + return $button->click($event); + } + + return $button; + } + + /** + * normal + * + * @time 2021年03月23日 + * @param string $text + * @param string|null $event + * @return mixed + */ + public static function normal(string $text, string $event = null) + { + $button = (new Button) + ->size('mini') + ->text($text); + + if ($event) { + return $button->click($event); + } + + return $button; + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/ComponentsTrait.php b/extend/catcher/library/table/ComponentsTrait.php new file mode 100644 index 0000000..eed4487 --- /dev/null +++ b/extend/catcher/library/table/ComponentsTrait.php @@ -0,0 +1,67 @@ +attributes['component'][] = [ + 'name' => $name, + 'field' => $updateField, + 'options' => $options + ]; + + return $this; + } + + /** + * switch + * + * @time 2021年03月23日 + * @param null $updateFields + * @return HeaderItem + */ + public function withSwitchComponent($updateFields = null): HeaderItem + { + return $this->component('switch_', $updateFields ? : $this->attributes['prop']); + } + + /** + * edit + * + * @time 2021年03月23日 + * @param null $updateFields + * @return HeaderItem + */ + public function withEditComponent($updateFields = null): HeaderItem + { + return $this->component('edit', $updateFields ? : $this->attributes['prop']); + } + + /** + * Edit Number + * + * @time 2021年03月23日 + * @param null $updateFields + * @return HeaderItem + */ + public function withEditNumberComponent($updateFields = null): HeaderItem + { + return $this->component('editNumber', $updateFields ? : $this->attributes['prop']); + } + + + public function withSelectComponent(array $options, $updateFields = null): HeaderItem + { + return $this->component('select_', $updateFields ? : $this->attributes['prop'], $options); + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/DynamicFormFields.php b/extend/catcher/library/table/DynamicFormFields.php new file mode 100644 index 0000000..e00befc --- /dev/null +++ b/extend/catcher/library/table/DynamicFormFields.php @@ -0,0 +1,383 @@ + ['^[A-Za-z]+$', '必须为纯字母'], + 'alphaNum' => ['^[A-Za-z0-9]+$', '必须为字母和数字'], + 'alphaDash' => ['^[A-Za-z0-9\-\_]+$', '必须为字母和数字，下划线_及破折号-'], + 'mobile' => ['^1[3-9]\d{9}$','请输入正确的手机号格式'], + 'idCard' => ['(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}$)','身份证输入格式不正确'], + 'zip' => ['\d{6}','请输入有效的邮政编码'], + 'ip' => ['((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))', '请输入正确的 IP 地址'], + 'password' => ['^[a-zA-Z]\w{5,17}$', '以字母开头，长度在6~18之间，只能包含字母、数字和下划线'], + 'strong_password' => ['^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$', '必须包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间'], + 'landLine' => ['\d{3}-\d{8}|\d{4}-\d{7}', '请输入正确的座机格式'], + 'chinese_character' => ['^[\u4e00-\u9fa5]{0,}$', '必须为纯汉字'] + ]; + + /** + * build form field + * + * @time 2021年03月10日 + * @param $modelId + * @throws \think\db\exception\DataNotFoundException + * @throws \think\db\exception\DbException + * @throws \think\db\exception\ModelNotFoundException + * @return array + */ + public function build($modelId): array + { + $fields = []; + + Fields::where('model_id', $modelId) + ->where('status', Fields::ENABLE) + ->select() + ->each(function ($field) use (&$fields){ + $formField = $this->{$field['type']}($field); + + $formField = $this->getOptions($formField, $field['options'] ?? ''); + + $formField = $this->appendValidates($formField, $field['rules']); + + $formField = $this->pattern($formField, $field['pattern']); + + $fields[] = $formField; + }); + + return $fields; + } + + /** + * 字符串 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Input + */ + public function string($field): \FormBuilder\UI\Elm\Components\Input + { + return Form::input($field['name'], $field['title']); + } + + /** + * 整型 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\InputNumber + */ + public function int($field): \FormBuilder\UI\Elm\Components\InputNumber + { + return Form::number($field['name'], $field['tittle']); + } + + /** + * 浮点 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\InputNumber + */ + public function float($field): \FormBuilder\UI\Elm\Components\InputNumber + { + return Form::number($field['name'], $field['tittle']); + } + + /** + * textarea + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Input + */ + public function textarea($field): \FormBuilder\UI\Elm\Components\Input + { + return Form::textarea($field['name'], $field['tittle']); + } + + /** + * 编辑器 + * + * @time 2021年03月09日 + * @param $field + * @return mixed + */ + public function text($field) + { + return Form::editor($field['name'], $field['tittle']); + } + + /** + * longtext + * + * @time 2021年03月09日 + * @param $field + * @return mixed + */ + public function longtext($field) + { + return Form::editor($field['name'], $field['tittle']); + } + + /** + * 日期类型 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\DatePicker + */ + public function date($field): \FormBuilder\UI\Elm\Components\DatePicker + { + return Form::date($field['name'], $field['tittle']); + } + + /** + * 日期时间 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\DatePicker + */ + public function datetime($field): \FormBuilder\UI\Elm\Components\DatePicker + { + return Form::dateTime($field['name'], $field['tittle']); + } + + /** + * 图片 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Upload + */ + public function image($field): \FormBuilder\UI\Elm\Components\Upload + { + return Form::image($field['name'])->uploadName('image'); + } + + /** + * 多图 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Upload + */ + public function images($field): \FormBuilder\UI\Elm\Components\Upload + { + return Form::images($field['name'])->uploadName('image'); + } + + /** + * 上传文件 + * + * @time 2021年03月09日 + * @param $field + * @return mixed + */ + public function file($field) + { + return Form::file($field['name'])->uploadName('file'); + } + + /** + * 上传多个文件 + * + * @time 2021年03月09日 + * @param $field + * @return mixed + */ + public function files($field) + { + return Form::files($field['name'])->uploadName('file'); + } + + /** + * 下拉框 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Select + */ + public function select($field): \FormBuilder\UI\Elm\Components\Select + { + return Form::select($field['name'], $field['title']); + } + + /** + * checkbox + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Select + */ + public function checkbox($field): \FormBuilder\UI\Elm\Components\Select + { + return Form::select($field['name'], $field['title']); + } + + /** + * radio + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Select + */ + public function radio($field): \FormBuilder\UI\Elm\Components\Select + { + return Form::select($field['name'], $field['title'])->options($this->getOptions($field['options'])); + } + + /** + * 密码 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Input + */ + public function password($field): \FormBuilder\UI\Elm\Components\Input + { + return Form::password($field['name'], $field['title']); + } + + /** + * 颜色 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\ColorPicker + */ + public function color($field): \FormBuilder\UI\Elm\Components\ColorPicker + { + return Form::color($field['name'], $field['title']); + } + + /** + * 省市选择 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Cascader + */ + public function city($field): \FormBuilder\UI\Elm\Components\Cascader + { + return Form::city($field['name'], $field['title']); + } + + /** + * 省市区选择 + * + * @time 2021年03月09日 + * @param $field + * @return \FormBuilder\UI\Elm\Components\Cascader + */ + public function area($field): \FormBuilder\UI\Elm\Components\Cascader + { + return Form::cityArea($field['name'], $field['title']); + } + + /** + * options + * + * @time 2021年03月09日 + * @param $formField + * @param $options + * @return mixed + */ + protected function getOptions($formField, $options) + { + if (!$options) { + return $formField; + } + + return $formField->options(Helper::getOptions($options)); + } + + /** + * 验证规则 + * + * @time 2021年03月09日 + * @param $formField + * @param $validates + * @return mixed + */ + protected function appendValidates($formField, $validates) + { + if (count($validates)) { + foreach ($validates as $validate) { + if ($validate === 'require') { + $formField = $formField->required(); + } + + switch ($validate) { + case 'number': + $formField->appendValidate(Form::validateNum()->message('请输入数字')); + break; + case 'integer': + $formField->appendValidate(Form::validateInt()->message('请输入整型数字')); + break; + case 'float': + $formField->appendValidate(Form::validateFloat()->message('请输入浮点型数字')); + break; + case in_array($validate, ['email', 'url', 'date']): + $message = [ + 'email' => '邮箱格式不正确', + 'url' => 'url 地址格式不正确', + 'date' => '日期格式不正确' + ]; + $method = 'validate' . ucfirst($validate); + $formField->appendValidate(Form::{$method}()->message($message[$validate])); + break; + default: + if (isset($this->defaultRules[$validate])) { + list($pattern, $message) = $this->defaultRules[$validate]; + + $formField->appendValidate( + Form::validateStr()->pattern($pattern)->message($message) + ); + } + break; + } + } + } + + return $formField; + } + + /** + * 正则 + * + * @time 2021年03月10日 + * @param $formField + * @param $pattern + * @return mixed + */ + protected function pattern($formField, $pattern) + { + if ($pattern) { + list($pattern, $message) = explode('|', $pattern); + + return $formField->appendValidate( + Form::validateStr()->pattern($pattern)->message($message) + ); + } + + return $formField; + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/Events.php b/extend/catcher/library/table/Events.php new file mode 100644 index 0000000..94c7bca --- /dev/null +++ b/extend/catcher/library/table/Events.php @@ -0,0 +1,20 @@ +appendEvents([ + 'selection-change' => 'handleSelectMulti' + ]); + + return $this; + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/HeaderItem.php b/extend/catcher/library/table/HeaderItem.php new file mode 100644 index 0000000..a2d24f4 --- /dev/null +++ b/extend/catcher/library/table/HeaderItem.php @@ -0,0 +1,83 @@ +attributes['label'] = $label; + + return $this; + } + + public static function label(string $label): HeaderItem + { + return new self($label); + } + + public function prop(string $prop): HeaderItem + { + $this->attributes['prop'] = $prop; + + return $this; + } + + public function width(string $width): HeaderItem + { + $this->attributes['width'] = $width; + + return $this; + } + + public function actions(array $actions): HeaderItem + { + foreach ($actions as $action) { + $this->attributes['action'][] = $action->render(); + } + + return $this; + } + + public function isBubble($bubble = false): HeaderItem + { + $this->attributes['isBubble'] = $bubble; + + return $this; + } + + /** + * selection + * + * @time 2021年03月29日 + * @return mixed + */ + public function selection() + { + return $this->width(50)->type('selection'); + } + + + /** + * 动态访问 + * + * @time 2021年03月24日 + * @param $method + * @param $params + * @return $this + */ + public function __call($method, $params): HeaderItem + { + $this->attributes[$method] = $params[0]; + + return $this; + } + + public function __get($key) + { + return $this->{$key}; + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/Search.php b/extend/catcher/library/table/Search.php new file mode 100644 index 0000000..7f241e2 --- /dev/null +++ b/extend/catcher/library/table/Search.php @@ -0,0 +1,106 @@ +placeholder($placeholder); + } + + /** + * 状态 + * + * @time 2021年03月23日 + * @param $placeholder + * @return \FormBuilder\UI\Elm\Components\Select + */ + public static function status($placeholder = '请选择状态'): \FormBuilder\UI\Elm\Components\Select + { + return self::select('status', $placeholder, [ + [ 'value' => 1, 'label'=> ' 正常'], + [ 'value' => 2, 'label'=> ' 禁用'] + ]); + } + + /** + * 开始时间 + * + * @time 2021年03月23日 + * @param string $placeholder + * @return \FormBuilder\UI\Elm\Components\DatePicker + */ + public static function startAt($placeholder = '开始时间'): \FormBuilder\UI\Elm\Components\DatePicker + { + return self::datetime('start_at', '') + ->placeholder($placeholder) + ->format('yy-MM-DD HH:i:s'); + } + + /** + * 结束时间 + * + * @time 2021年03月23日 + * @param string $placeholder + * @return \FormBuilder\UI\Elm\Components\DatePicker + */ + public static function endAt($placeholder = '结束时间'): \FormBuilder\UI\Elm\Components\DatePicker + { + return self::datetime('end_at', '') + ->placeholder($placeholder) + ->format('yy-MM-DD HH:i:s'); + } + + /** + * 文本 + * + * @time 2021年03月23日 + * @param $name + * @param $placeholder + * @return \FormBuilder\UI\Elm\Components\Input + */ + public static function text($name, $placeholder): \FormBuilder\UI\Elm\Components\Input + { + return Form::input($name, '')->placeholder($placeholder); + } + + /** + * 选择 + * + * @time 2021年03月23日 + * @param $name + * @param $placeholder + * @param $options + * @return \FormBuilder\UI\Elm\Components\Select + */ + public static function select($name, $placeholder, $options): \FormBuilder\UI\Elm\Components\Select + { + return Form::select($name, '')->placeholder($placeholder) + ->options($options); + } + + /** + * 选择时间 + * + * @time 2021年03月23日 + * @param $name + * @param $placeholder + * @return \FormBuilder\UI\Elm\Components\DatePicker + */ + public static function datetime($name, $placeholder): \FormBuilder\UI\Elm\Components\DatePicker + { + return Form::dateTime($name, '') + ->placeholder($placeholder) + ->format('yyyy-MM-dd HH:i:s'); + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/Table.php b/extend/catcher/library/table/Table.php new file mode 100644 index 0000000..6283254 --- /dev/null +++ b/extend/catcher/library/table/Table.php @@ -0,0 +1,379 @@ +ref = $ref; + } + + /** + * 设置头信息 + * + * @time 2021年03月21日 + * @param array $header + * @return $this + */ + public function header(array $header): Table + { + foreach ($header as $h) { + $this->header[] = $h->attributes; + } + + return $this; + } + + /** + * 设置 actions + * + * @time 2021年03月21日 + * @param array $actions + * @return $this + */ + public function withActions(array $actions): Table + { + foreach ($actions as $action) { + $this->actions[] = $action->render(); + } + + return $this; + } + + /** + * 设置搜索参数 + * + * @time 2021年03月21日 + * @param array $search + * @return $this + */ + public function withSearch(array $search): Table + { + $this->search = $search; + + return $this; + } + + /** + * 表单事件 + * + * @time 2021年03月21日 + * @param array $events + * @return $this + */ + public function withEvents(array $events): Table + { + $this->events = $events; + + return $this; + } + + /** + * set + * + * @time 2021年03月29日 + * @param array $params + * @return $this + */ + public function withDefaultQueryParams(array $params): Table + { + $this->defaultQueryParams = $params; + + return $this; + } + + /** + * 隐藏分页 + * + * @time 2021年03月29日 + * @return $this + */ + public function withHiddenPaginate(): Table + { + $this->hiddenPaginate = true; + + return $this; + } + + /** + * 设置 api route + * + * @time 2021年03月29日 + * @param string $apiRoute + * @return $this + */ + public function withApiRoute(string $apiRoute): Table + { + $this->apiRoute = $apiRoute; + + return $this; + } + + /** + * loading + * + * @time 2021年03月29日 + * @return $this + */ + public function withLoading(): Table + { + $this->loading = true; + + return $this; + } + + + /** + * 设置弹出层的宽度 + * + * @time 2021年03月29日 + * @param string $width + * @return $this + */ + public function withDialogWidth(string $width): Table + { + $this->dialog['width'] = $width; + + return $this; + } + + /** + * 变成 tree table + * + * @time 2021年03月29日 + * @param string $rowKey + * @param array $props ['children' => '', 'hasChildren' => ''] + * @return $this + */ + public function toTreeTable(string $rowKey = 'id', array $props = []): Table + { + $this->tree['row_key'] = $rowKey; + + $this->tree['props'] = count($props) ? $props : [ + 'children' => 'children', + 'hasChildren' => 'hasChildren' + ]; + + return $this; + } + + /** + * 渲染 + * + * @time 2021年03月21日 + * @return array + */ + public function render(): array + { + + $render = []; + + foreach (get_class_vars(self::class) as $property => $v) { + if (!empty($this->{$property})) { + $render[$property] = $this->{$property}; + } + } + + return $render; + } + + + /** + * 追加 headers + * + * @time 2021年03月28日 + * @param $header + * @return $this + */ + public function appendHeaders($header): Table + { + if ($header instanceof HeaderItem) { + $this->header[] = $header; + } + + + if (is_array($header)) { + $this->header = array_merge($this->header, $header); + } + + return $this; + } + + /** + * 追加 + * + * @time 2021年03月29日 + * @param string $param + * @return $this + */ + public function appendDefaultQueryParams(string $param): Table + { + $this->defaultQueryParams[] = $param; + + return $this; + } + + /** + * 追加 events + * + * @time 2021年03月28日 + * @param array $events + * @return $this + */ + public function appendEvents(array $events): Table + { + $this->events = array_merge($this->events, $events); + + return $this; + } + + /** + * 追加 events + * + * @time 2021年03月28日 + * @param array $actions + * @return $this + */ + public function appendActions(array $actions): Table + { + $this->actions = array_merge($this->actions, $actions); + + return $this; + } + + /** + * 追加 header + * + * @time 2021年03月28日 + * @param array $header + * @return $this + */ + public function appendHeader(array $header): Table + { + $this->header = array_merge($this->header, $header); + + return $this; + } + + /** + * 获取头部 + * + * @time 2021年03月29日 + * @return array + */ + public function getHeader(): array + { + return $this->header; + } + + /** + * 获取事件 + * + * @time 2021年03月29日 + * @return array + */ + public function getEvents(): array + { + return $this->events; + } + + /** + * 获取表格操作 + * + * @time 2021年03月29日 + * @return array + */ + public function getActions(): array + { + return $this->actions; + } + + /** + * 获取 默认 query params + * + * @time 2021年03月29日 + * @return array + */ + public function getDefaultQueryParams(): array + { + return $this->defaultQueryParams; + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/components/Button.php b/extend/catcher/library/table/components/Button.php new file mode 100644 index 0000000..0793845 --- /dev/null +++ b/extend/catcher/library/table/components/Button.php @@ -0,0 +1,36 @@ +attributes['icon'] = $icon; + + return $this; + } + + public function text(string $text): Button + { + $this->attributes['label'] = $text; + + return $this; + } + + public function style(string $style): Button + { + $this->attributes['class'] = $style; + + return $this; + } + + public function click(string $click): Button + { + $this->attributes['click'] = $click; + + return $this; + } +} \ No newline at end of file diff --git a/extend/catcher/library/table/components/Component.php b/extend/catcher/library/table/components/Component.php new file mode 100644 index 0000000..b63ceea --- /dev/null +++ b/extend/catcher/library/table/components/Component.php @@ -0,0 +1,43 @@ +attributes['el'] = $this->el; + } + + /** + * 魔术方法 + * + * @time 2021年03月21日 + * @param $method + * @param $params + * @return $this + */ + public function __call($method, $params): Component + { + $this->attributes[$method] = $params[0]; + + return $this; + } + + /** + * 输出 + * + * @time 2021年03月23日 + * @return array + */ + public function render() + { + return $this->attributes; + } +} \ No newline at end of file