【新增】表格div.pre启用slimScroll美化滚动条

【新增】五等分栅格布局【优化】上传组件记录extparam参数【优化】crud生成表单样式调整【优化】nice-validator样式调整
2018-04-16 17:34:32 +08:00 · 2018-04-16 17:34:32 +08:00 · 8074c83bbf
parent 20a5be0094
commit 8074c83bbf
9 changed files with 146 additions and 28 deletions
--- a/application/admin/command/Crud.php
+++ b/application/admin/command/Crud.php
@ -454,6 +454,7 @@ class Crud extends Command
            //循环所有字段,开始构造视图的HTML和JS信息
            foreach ($columnList as $k => $v) {
                $field = $v['COLUMN_NAME'];
+                $langField = mb_ucfirst($field);
                $itemArr = [];
                // 这里构建Enum和Set类型的列表数据
                if (in_array($v['DATA_TYPE'], ['enum', 'set', 'tinyint'])) {
@ -509,6 +510,7 @@ class Crud extends Command
                        $formEditElement = $this->getReplacedStub('html/select', ['field' => $field, 'fieldName' => $fieldName, 'fieldList' => $this->getFieldListName($field), 'attrStr' => Form::attributes($attrArr), 'selectedValue' => "\$row.{$field}"]);
                    } else if ($inputType == 'datetime') {
                        $cssClassArr[] = 'datetimepicker';
+                        $attrArr['placeholder'] = "{:__('Please select')}{:__('{$langField}')}";
                        $attrArr['class'] = implode(' ', $cssClassArr);
                        $format = "YYYY-MM-DD HH:mm:ss";
                        $phpFormat = "Y-m-d H:i:s";
@ -564,6 +566,7 @@ class Crud extends Command
                        $formEditElement = $this->getReplacedStub('html/' . $inputType, ['field' => $field, 'fieldName' => $fieldName, 'fieldList' => $this->getFieldListName($field), 'attrStr' => Form::attributes($attrArr), 'selectedValue' => "\$row.{$field}"]);
                    } else if ($inputType == 'textarea') {
                        $cssClassArr[] = substr($field, -7) == 'content' ? $this->editorClass : '';
+                        $attrArr['placeholder'] = "{:__('Please input')}{:__('{$langField}')}";
                        $attrArr['class'] = implode(' ', $cssClassArr);
                        $attrArr['rows'] = 5;
                        $formAddElement = Form::textarea($fieldName, $defaultValue, $attrArr);
@ -583,17 +586,20 @@ class Crud extends Command
                        $formEditElement .= sprintf(Form::label("{$attrArr['id']}", "%s {:__('Yes')}", ['class' => 'control-label']), Form::checkbox($fieldName, $yes, 0, $attrArr));
                        $formEditElement = str_replace('type="checkbox"', 'type="checkbox" {in name="' . "\$row.{$field}" . '" value="' . $yes . '"}checked{/in}', $formEditElement);
                    } else if ($inputType == 'citypicker') {
+                        $attrArr['placeholder'] = "{:__('Please select')}{:__('{$langField}')}";
                        $attrArr['class'] = implode(' ', $cssClassArr);
                        $attrArr['data-toggle'] = "city-picker";
                        $formAddElement = sprintf("<div class='control-relative'>%s</div>", Form::input('text', $fieldName, $defaultValue, $attrArr));
                        $formEditElement = sprintf("<div class='control-relative'>%s</div>", Form::input('text', $fieldName, $editValue, $attrArr));
                    } else {
+                        $attrArr['placeholder'] = "{:__('Please input')}{:__('{$langField}')}";
                        $search = $replace = '';
                        //特殊字段为关联搜索
                        if ($this->isMatchSuffix($field, $this->selectpageSuffix)) {
                            $inputType = 'text';
                            $defaultValue = '';
                            $attrArr['data-rule'] = 'required';
+                            $attrArr['placeholder'] = "{:__('Please select')}{:__('{$langField}')}";
                            $cssClassArr[] = 'selectpage';
                            $selectpageController = str_replace('_', '/', substr($field, 0, strripos($field, '_')));
                            $attrArr['data-source'] = $selectpageController . "/index";
@ -1141,8 +1147,8 @@ EOD;
        $langField = mb_ucfirst($field);
        return <<<EOD
    <div class="form-group">
-        <label for="c-{$field}" class="control-label col-xs-12 col-sm-2">{:__('{$langField}')}:</label>
-        <div class="col-xs-12 col-sm-8">
+        <label for="c-{$field}" class="control-label">{:__('{$langField}')}:</label>
+        <div class="pp_container">
            {$content}
        </div>
    </div>
--- a/application/admin/command/Crud/stubs/add.stub
+++ b/application/admin/command/Crud/stubs/add.stub
@ -1,11 +1,9 @@
-<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
-
+<form id="add-form" role="form" data-toggle="validator" method="POST" action="">
 {%addList%}
-    <div class="form-group layer-footer">
-        <label class="control-label col-xs-12 col-sm-2"></label>
-        <div class="col-xs-12 col-sm-8">
+    <div class="form-group layer-footer text-center">
+        <div class="pp_container text-center">
            <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
-</form>
+</form>
--- a/application/admin/command/Crud/stubs/edit.stub
+++ b/application/admin/command/Crud/stubs/edit.stub
@ -1,11 +1,9 @@
-<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
-
+<form id="edit-form" role="form" data-toggle="validator" method="POST" action="">
 {%editList%}
    <div class="form-group layer-footer">
-        <label class="control-label col-xs-12 col-sm-2"></label>
-        <div class="col-xs-12 col-sm-8">
+        <div class="pp_container text-center">
            <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
-</form>
+</form>
--- a/application/admin/controller/Ajax.php
+++ b/application/admin/controller/Ajax.php
@ -54,6 +54,7 @@ class Ajax extends Backend

        //判断是否已经存在附件
        $sha1 = $file->hash();
+        $extparam = $this->request->post();

        $upload = Config::get('upload');

@ -99,7 +100,7 @@ class Ajax extends Backend
                $imagewidth = isset($imgInfo[0]) ? $imgInfo[0] : $imagewidth;
                $imageheight = isset($imgInfo[1]) ? $imgInfo[1] : $imageheight;
            }
-            $params = array(
+            $params = [
                'filesize'    => $fileInfo['size'],
                'imagewidth'  => $imagewidth,
                'imageheight' => $imageheight,
@ -110,13 +111,14 @@ class Ajax extends Backend
                'uploadtime'  => time(),
                'storage'     => 'local',
                'sha1'        => $sha1,
-            );
+                'extparam'    => json_encode($extparam),
+            ];
            $attachment = model("attachment");
            $attachment->data(array_filter($params));
            $attachment->save();
            \think\Hook::listen("upload_after", $attachment);
            $this->success(__('Upload successful'), null, [
-                'url' => $uploadDir . $splInfo->getSaveName()
+                'url' => $uploadDir . $splInfo->getSaveName(),
            ]);
        } else {
            // 上传失败获取错误信息
@ -178,7 +180,7 @@ class Ajax extends Backend
            $sour_value = $weighdata[$sour_id];
            //echo "移动的ID:{$sour_id}\n";
            //echo "替换的ID:{$desc_id}\n";
-            $weighids = array();
+            $weighids = [];
            $temp = array_values(array_diff_assoc($ids, $sour));
            foreach ($temp as $m => $n) {
                if ($n == $sour_id) {
@ -251,13 +253,10 @@ class Ajax extends Backend
    public function area()
    {
        $params = $this->request->get("row/a");
-        if (!empty($params))
-        {
+        if (!empty($params)) {
            $province = isset($params['province']) ? $params['province'] : '';
            $city = isset($params['city']) ? $params['city'] : null;
-        }
-        else
-        {
+        } else {
            $province = $this->request->get('province');
            $city = $this->request->get('city');
        }
--- a/application/admin/lang/zh-cn.php
+++ b/application/admin/lang/zh-cn.php
@ -172,4 +172,6 @@ return [
    'Rule tips'                                             => '规则通常对应一个控制器的方法,同时左侧的菜单栏数据也从规则中体现,通常建议通过命令行进行生成规则节点',
    'Test'                                                  => '测试',
    'All'                                                   => '全部',
+    'Please input'                                          => '请填写',
+    'Please select'                                         => '请选择',
 ];
--- a/public/assets/css/backend.css
+++ b/public/assets/css/backend.css
@ -131,7 +131,14 @@ html.ios-fix body {
 table.table-template {
  overflow: hidden;
 }
-.sp_container .msg-box {
+.pp_container {
+  border: none;
+  margin: 0;
+  padding: 0;
+  position: relative;
+  vertical-align: middle;
+}
+.sp_container .msg-box,.pp_container .msg-box {
  position: absolute;
  left: 0;
  top: 0;
@ -811,3 +818,51 @@ form.form-horizontal .control-label {
 .wipecache li a {
  color: #444444!important;
 }
+
+.col-md-1-5 {
+  width: 20% !important;
+  float: left;
+}
+
+.col-xs-1-5,.col-sm-1-5,.col-md-1-5,.col-lg-1-5 {
+  min-height: 1px;
+  padding-left: 15px;
+  padding-right: 15px;
+  position: relative;
+}
+
+@media (min-width: 768px) {
+  .col-sm-1-5 {
+    width: 20%;
+    float: left;
+  }
+}
+
+@media (min-width: 992px) {
+  .col-md-1-5 {
+    width: 20%;
+    float: left;
+  }
+}
+
+@media (min-width: 1200px) {
+  .col-lg-1-5 {
+    width: 20%;
+    float: left;
+  }
+}
+
+div.pre {
+  display: block;
+  padding: 5px;
+  margin: 0 0 5px;
+  font-size: 11px;
+  line-height: 1.42857143;
+  word-break: break-all;
+  word-wrap: break-word;
+  color: #333333;
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border-radius: 3px;
+  text-align: left;
+}
--- a/public/assets/css/backend.min.css
+++ b/public/assets/css/backend.min.css
--- a/public/assets/js/require-table.js
+++ b/public/assets/js/require-table.js
@ -152,6 +152,11 @@ define(['jquery', 'bootstrap', 'moment', 'moment/locale/zh-cn', 'bootstrap-table
                            });
                        });
                    }
+                    if (table.find("div.pre").size() > 0) {
+                        require(['slimscroll'], function () {
+                            $('div.pre').slimScroll({width: '300px', height: '50px'});
+                        });
+                    }
                });
                // 处理选中筛选框后按钮的状态统一变更
                table.on('check.bs.table uncheck.bs.table check-all.bs.table uncheck-all.bs.table', function () {
--- a/public/assets/less/backend.less
+++ b/public/assets/less/backend.less
@ -147,10 +147,17 @@ html.ios-fix,html.ios-fix body {
 table.table-template{
    overflow:hidden;
 }
-.sp_container .msg-box{
-    position: absolute;
-    right: 0;
-    top: 0;
+.pp_container {
+  border: none;
+  margin: 0;
+  padding: 0;
+  position: relative;
+  vertical-align: middle;
+}
+.sp_container .msg-box,.pp_container .msg-box {
+  position: absolute;
+  left: 0;
+  top: 0;
 }
 .toast-top-right-index{
    top:62px;
@ -851,4 +858,52 @@ form.form-horizontal .control-label {

 .wipecache li a {
    color:#444444!important;
+}
+
+.col-md-1-5 {
+    width: 20% !important;
+    float: left;
+}
+
+.col-xs-1-5,.col-sm-1-5,.col-md-1-5,.col-lg-1-5 {
+    min-height: 1px;
+    padding-left: 15px;
+    padding-right: 15px;
+    position: relative;
+}
+
+@media (min-width: 768px) {
+    .col-sm-1-5 {
+        width: 20%;
+        float: left;
+    }
+}
+
+@media (min-width: 992px) {
+    .col-md-1-5 {
+        width: 20%;
+        float: left;
+    }
+}
+
+@media (min-width: 1200px) {
+    .col-lg-1-5 {
+        width: 20%;
+        float: left;
+    }
+}
+
+div.pre {
+    display: block;
+    padding: 5px;
+    margin: 0 0 5px;
+    font-size: 11px;
+    line-height: 1.42857143;
+    word-break: break-all;
+    word-wrap: break-word;
+    color: #333333;
+    background-color: #f5f5f5;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+    text-align: left;
 }