diff --git a/lib/zin/func.php b/lib/zin/func.php index a3f1a42ab0..ffc5071b4d 100644 --- a/lib/zin/func.php +++ b/lib/zin/func.php @@ -1303,9 +1303,11 @@ function dragUl(): dragUl /** * Zentao custom table columns widget. * - * ?array leftItems - * ?array flexItems - * ?array rightItems + * ?array leftItems + * ?array flexItems + * ?array rightItems + * string url + * ?string method */ function editCols(): editCols { diff --git a/lib/zin/wg/dragul/v1.php b/lib/zin/wg/dragul/v1.php index b667338263..5e2c7f1288 100644 --- a/lib/zin/wg/dragul/v1.php +++ b/lib/zin/wg/dragul/v1.php @@ -104,6 +104,7 @@ class dragUl extends wg { $ul = ul ( + setClass('drag-ul'), set($this->props->skip(array_keys(static::getDefinedProps()))), $this->children(), ); diff --git a/lib/zin/wg/editcols/v1.php b/lib/zin/wg/editcols/v1.php index c071f7898a..68dcdcc09b 100644 --- a/lib/zin/wg/editcols/v1.php +++ b/lib/zin/wg/editcols/v1.php @@ -5,11 +5,15 @@ namespace zin; class editCols extends wg { protected static $defineProps = array( - 'leftItems?: array', // 左侧固定列 - 'flexItems?: array', // 中间弹性列 - 'rightItems?: array' // 右侧固定列 + 'leftItems?: array', // 左侧固定列 + 'flexItems?: array', // 中间弹性列 + 'rightItems?: array', // 右侧固定列 + 'url?: string', // 表单地址 + 'method?: string="post"' // 表单方法 ); + private $formGID; + public static function getPageCSS(): string|false { return file_get_contents(__DIR__ . DS . 'css' . DS . 'v1.css'); @@ -23,6 +27,7 @@ class editCols extends wg return li ( setClass('row', 'items-center', 'border', 'px-5', 'h-9'), + set('data-key', $item['name']), $isRequired ? setClass('required-col') : null, checkbox ( @@ -52,35 +57,71 @@ class editCols extends wg private function buildBody() { - global $lang; - $itemsList = $this->prop(array('leftItems', 'flexItems', 'rightItems')); + $itemsList = array( + 'left' => $this->prop('leftItems'), + 'flex' => $this->prop('flexItems'), + 'right' => $this->prop('rightItems'), + ); + $body = form ( - set::grid(false), setClass('col', 'gap-0.5'), + set::grid(false), set::actions(null), ); - foreach($itemsList as $items) + + foreach($itemsList as $key => $items) { - $ul = dragUl(); + if(empty($items)) continue; + + $ul = dragUl(setClass("{$key}-cols")); foreach ($items as $item) $ul->add($this->onBuildItem($item)); $body->add($ul); } - $body->add - ( - toolbar - ( - setClass('modal-footer justify-center'), - item - ( - set(array('text' => $lang->save, 'type' => 'primary', 'btnType' => 'submit', 'class' => 'w-28', 'data-dismiss' => 'modal')), - on::click('loadTable();') - ) - ) - ); + + $body->setProp('data-zin-gid', $body->gid); + $this->formGID = $body->gid; return $body; } + private function submitFunc() + { + $url = $this->prop('url'); + $method = $this->prop('method'); + + return << '[data-zin-gid="{$this->formGID}"] .drag-ul.' + value + '-cols'; + const colsList = types.map(x => document.querySelector(getSelector(x))); + + for(let i = 0; i < colsList.length; i++) + { + const cols = colsList[i]; + if(!cols) continue; + + const children = Array.from(cols.children); + for(let j = 0; j < children.length; j++) + { + const li = children[j]; + const checkbox = li.querySelector('input[type="checkbox"]'); + const input = li.querySelector('input[type="text"]'); + formData.push({ + id: li.dataset.key, + order: ++index, + show: checkbox.checked, + width: input.value + 'px', + fixed: types[i] === 'flex' ? 'no' : types[i], + }); + } + } + + fetch('{$url}', {method: '{$method}', body: JSON.stringify(formData)}) + .then(() => loadTable()); + FUNC; + } + protected function build() { global $lang, $app; @@ -90,9 +131,20 @@ class editCols extends wg ( setClass('edit-cols'), set::title($lang->datatable->custom), - set::footerClass('justify-center'), to::header(span($lang->datatable->customTip, setClass('text-gray', 'text-md'))), + set::footerClass('justify-center'), $this->buildBody(), + to::footer + ( + toolbar + ( + item + ( + set(array('text' => $lang->save, 'type' => 'primary', 'class' => 'w-28', 'data-dismiss' => 'modal')), + on::click($this->submitFunc()) + ) + ) + ), ); } }