1.03

packages/list/src/main.vue

@@ -55,6 +55,7 @@
   import NtRemoveForm from '../../re-form';
   import {initVueData, utilBtnEventList, unitTableAllEvent, searchSourceData, unitInitDataTableList, unitInitSelectList, reloadItemSelectList} from './tool-list';
   import { isTypeof } from 'submodule/dx-element-ui/src/tools/utils';
+  import bus from "submodule/dx-element-ui/src/tools/eventBus";
 
   export default {
     name: 'DxTableList',
@@ -83,7 +84,7 @@
       },
       tableListName: {
         type: String,
-        required: true
+        required: false
       },
       custTableTitle: {
         type: String,
@@ -137,7 +138,7 @@
       },
       page_status: {
         type: Number,
-        default: 12
+        default: 13
       },
       page_column: {
         type: Array,
@@ -182,6 +183,10 @@
               type: 1,
               key: 'size',
               value: 'pageSize'
+          },{
+            type: 2,
+            key: 'param',
+            value: {}
           }];
         }
       },
@@ -197,9 +202,10 @@
         type: Object,
         default: function () {
           return {
-            key: 'errno',
+            key: 'code',
             value: 0,
-            message: 'message'
+            message: 'message',
+            logout: '2814'
           };
         }
       },
@@ -234,6 +240,14 @@
       isMultiple: {
         type: Boolean,
         default: false
+      },
+      selectable: {
+        type: Function,
+        default () {
+          return function(row, index) {
+            return true;
+          }
+        }
       }
     },
     provide() {
@@ -395,7 +409,16 @@
 
           resolve(treeData)
         }
-      }
+      },
+      toggleRowSelection(row, selected) {
+        bus.$emit('toggleRowSelection',row, selected);        
+      },
+      clearSelection() {
+        bus.$emit('clearSelection');
+      },
+      toggleAllSelection() {
+        bus.$emit('toggleAllSelection');
+      },
     }
   }
 

packages/list/src/search.vue

@@ -354,7 +354,8 @@ export default {
 
   .form-search-content {
     flex: 1;
-
+    display: flex; 
+    flex-wrap: wrap;
     .form-input__only {
       display: flex;
       float: left;

packages/list/src/tables.vue

@@ -23,7 +23,7 @@
     :border="emTableList.border === false ? false : true"
     @filter-change="filterColHandler"
   >
-      <el-table-column v-if="emTableList.isMultiple" type="selection" :fixed="true" align="center"></el-table-column>
+      <el-table-column v-if="emTableList.isMultiple" type="selection" :selectable="emTableList.selectable" :fixed="true" align="center"></el-table-column>
       <el-table-column
         v-for="(item, index) in emTableList.showColumns"
         v-if="isShow(item) && item.stype !== 'checkbox'"
@@ -39,11 +39,10 @@
         :filters="tcpFilters(item)"
         :column-key="item.field ? item.field : ''"
         :filter-multiple="item.filterMultiple ? item.filterMultiple : false"
-        :formatter="item.formatter ? formatter : formatterDef"
         :class-name="item.className"
       >
         <!--list属性-->
-        <template v-if="item.stype == 'list'">
+        <template v-if="item.stype === 'list'">
           <el-table-column
             v-for="(sub, subIndex) in item.sub"
             :key="subIndex"
@@ -55,7 +54,6 @@
             :sortable="sub.sort ? sub.sort : false"
             :fixed="sub.fixed ? sub.fixed : false"
             :show-overflow-tooltip="sub.tooltip === false ? false : true"
-            :formatter="sub.formatter ? formatter : formatterDef"
             :filters="item.filters"
             :column-key="item.field"
             :filter-multiple="item.filterMultiple ? item.filterMultiple : false"
@@ -107,8 +105,17 @@
             @click="emTableList.tableBtnEvent(item, { type: item.explain })"
           ></el-button>
           <span class="icon-name icon-info-name">{{ item.name }}</span>
+          <el-button
+            v-if="item.hasOwnProperty('headerBtn') && item.headerBtn"
+            :icon="item.headerBtn.icon"
+            :type="item.headerBtn.type ? item.headerBtn.type : 'text'"
+            style="padding: 0; margin-left: 4px;color:#409EFF"
+            circle
+            @click="emTableList.tableBtnEvent(item, { type: item.headerBtn.eventType })"
+          ></el-button>
+          
         </template>
-        <template slot-scope="scope" >
+        <template slot-scope="scope">
           <!--按钮-->
             <template v-if="item.stype === 'opt'">
                 <el-button
@@ -123,7 +130,6 @@
                 :circle="opt.shape === 'circle' ? true : false"
                 :disabled="opt.hasOwnProperty('disabled') ? opt.disabled : false"
                 @click="optCellData(scope.row, opt)"
-                v-shortcutKeys="{key:opt.type ==='detail'?'d':''}"
                 >
                 {{ opt.name }}
                 </el-button>
@@ -498,11 +504,10 @@
             <!--formatter-style属性-->
             <span
                 v-else-if="item.stype == 'formatter-style'"
-                v-html="formatterStyle(scope.row, item)"
+                v-html="formatter(scope.row, item,true)"
             ></span>
-            <span v-else>{{ scope.row[item.field] | nullMap}}</span>
+            <span v-else>{{ formatter(scope.row,item) | nullMap}}</span>
         </template>
-
       </el-table-column>
   </el-table>
 </template><script>
@@ -551,6 +556,9 @@ export default {
     nullMap:nullView
   },
   computed: {
+    multipleTable() {
+      return this.$refs.multipleTable
+    },
     defaultSort(){
       const defsort = this.showColumns.find(f=>typeof(f.sort) === 'string')
       return defsort && {prop: defsort.field, order: defsort.sort}
@@ -569,6 +577,18 @@ export default {
     }
   },
   mounted() {
+    bus.$on("toggleRowSelection", (row, selected) => {
+        if(this.emTableList.isMultiple) {
+          this.$refs.multipleTable.toggleRowSelection(row, selected);
+        }
+      });
+      bus.$on("clearSelection", () => {
+        this.$refs.multipleTable.clearSelection();
+      });
+      bus.$on("toggleAllSelection", () => {
+        this.$refs.multipleTable.toggleAllSelection();
+      });
+      
     if (this.isMultipleTables) {
       // 监听兄弟组件选中值变化
       bus.$on("checkedEventCardToTable", (data) => {
@@ -804,17 +824,13 @@ export default {
 
       this.optCellData(row, obj);
     },
-    formatterStyle(row, item) {
+    formatter(row, item,vHtml=false) {
       if (item.formatter) {
-        return selectListToValue(this, item.formatter, row[item.field], true);
+        return selectListToValue(this, item.formatter, row[item.field], vHtml);
       } else {
-        return "";
+        return row[item.field];
       }
     },
-    //格式化
-    formatter(row, column, cellValue, index) {
-      return formatterSelf(this, row, column, cellValue, index);
-    },
     // table图片地址拼接
     tableImageURL(item, url) {
       if (isHttpHeaderURL(url)) {

packages/list/src/tool-list.js

@@ -995,7 +995,7 @@ export function unitInitDataTableList(obj) {
     obj.loading = true;
     obj.tableData = [];
     let item = obj.queryURL['list'],
-        queryData = isTypeof(obj.queryParam) === 'function'
+        queryData =!obj.queryParam || isTypeof(obj.queryParam) === 'function'
             ? emitOnReqParams(obj, 'list')
             : getQueryParams(obj, true),
         // table中插入一条记录

readme.md

@@ -1,4 +1,14 @@
 ## 版本
+1.03
+  增加功能：
+  1.dx-table-list支持 selectable、selection-change、toggleRowSelection、clearSelection、toggleAllSelection 功能与 el-table 一致
+  2.page_column 支持列头后置按钮： page_column[*].headerBtn:{ eventType:'setting',icon:'el-icon-s-tools'}
+  3.兼容旧版的page_column[*].formatter配置
+  4.DxTableList.queryParam 增加param默认参数
+  5.DxTableList.responseSuccess 默认值与后端适配
+  6.DxTableList.page_status 默认值改为13
+  7.DxTableList.queryParam为假时，执行@onReqParams
+
 1.02
   增加功能：
   1.增加selection-change事件