优化表格选择器，支持textarea，支持多字段显示；

extend/base/common/command/admin/VersionBase.php

@@ -12,12 +12,12 @@ use think\console\Output;
 
 class VersionBase extends Command
 {
-    public const VERSION = 'v2.0.96';
+    public const VERSION = 'v2.0.97';
 
     public const LAYUI_VERSION = '2.8.17';
 
     public const COMMENT = [
-        '优化PHP配置进程数',
+        '优化表格选择器，支持textarea，支持多字段显示；',
         '发布新版本',
     ];
 

public/static/plugs/lay-module/tableData/tableData.css

@@ -2,6 +2,7 @@
   display: flex;
   align-items: center;
   justify-content: left;
+  flex-wrap: wrap;
 }
 .table-data-container .layui-input .placeholder {
   color: #808080;

public/static/plugs/lay-module/tableData/tableData.html

@@ -1,11 +1,12 @@
 <div class="table-data-container" ref="tableData">
     <input type="hidden" :name="setting.name" :value="value" :lay-verify="setting.required == 1?'required':''">
-    <div class="layui-input" @click="openSelectPage">
+    <div :class="setting.className" @click="openSelectPage">
         <div class="placeholder" v-if="listSelected.length == 0">{{setting.placeholder}}</div>
-        <div class="layui-btn layui-btn-xs layui-btn-normal" v-for="(itemSelect,indexSelect) in listSelected">
+        <div class="layui-btn-container">
-            <span>{{itemSelect[setting.fieldName]}}</span>
+            <div class="layui-btn layui-btn-xs layui-btn-normal" v-for="(itemSelect,indexSelect) in listSelectedShow">
-            <i class="layui-icon layui-icon-close" @click.stop="removeItem(itemSelect,indexSelect)" v-if="setting.readonly != 1"></i>
+                <span>{{itemSelect['_select_show']}}</span>
+                <i class="layui-icon layui-icon-close" @click.stop="removeItem(itemSelect,indexSelect)" v-if="setting.readonly != 1"></i>
+            </div>
         </div>
-
     </div>
 </div>

public/static/plugs/lay-module/tableData/tableData.js

@@ -20,7 +20,6 @@
         success: function (template) {
             tableDataTemplate = template;
         }
-
     });
 
     tableData.prototype.render = function (elem, data) {
@@ -41,6 +40,8 @@
             height: clientHeight,
             placeholder: '请选择',
             selectConfirmCallback: 'onTableDataConfirm',
+            type:'input',
+            className:'layui-input',
         };
 
         var options = $.extend(defaultOption, data);
@@ -55,6 +56,10 @@
 
         options.index += 'select_mode=' + options.selectType;
 
+        if(options.type == 'textarea'){
+            options.className = 'layui-textarea';
+        }
+
         app = new Vue({
             el: elem,
             data() {
@@ -72,6 +77,24 @@
                     this.value = valueList.join(',');
                 }
             },
+            computed: {
+                listSelectedShow() {
+                    if (this.setting.fieldName.indexOf('|') < 0) {
+                        return this.listSelected.map(item => item['_select_show'] = item[this.setting.fieldName]);
+                    }
+
+                    var fieldNameList = this.setting.fieldName.split('|');
+                    return this.listSelected.map(item => {
+                        var showText = '';
+                        fieldNameList.forEach(fieldName => {
+                            showText += item[fieldName] + ' ';
+                        });
+                        item['_select_show'] = showText;
+
+                        return item;
+                    });
+                },
+            },
             created() {
                 this.value = options.selectValue;
                 if (typeof this.value != 'string') {
@@ -106,7 +129,6 @@
                     }
 
                     var selectedIds = this.listSelected.map(item => item.id);
-
                     var index = layer.open({
                         title: '选择数据',
                         type: 2,
@@ -122,19 +144,14 @@
                                     if (options.selectType == 'radio') {
                                         this.listSelected = [];
                                     }
-
                                     var itemFind = this.listSelected.find(itemSelect => itemSelect[valueField] == dataItem[valueField]);
-
                                     if (itemFind == undefined) {
                                         this.listSelected.push(dataItem);
                                     }
-
-
                                 });
                                 this.$forceUpdate();
                                 layer.close(index);
                             };
-
                         },
                         end: function () {
                             index = null;

public/static/plugs/lay-module/tableData/tableData.scss

@@ -1,8 +1,9 @@
 .table-data-container {
     .layui-input {
-        display        : flex;
+        display: flex;
-        align-items    : center;
+        align-items: center;
         justify-content: left;
+        flex-wrap: wrap;
 
         .placeholder {
             color: #808080
@@ -17,7 +18,6 @@
         }
     }
 
-
     .layui-form-danger+.layui-input {
         border-color: #ff5722 !important;
     }