列表导出功能修改、图形分析默认日期修改

src/components/table/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div class="w100 h100">
         <!--  表格头部按钮  -->
         <el-row :gutter="10" class="mb8">
             <template v-if="config && config.tableButton && config.tableButton.top">
@@ -10,7 +10,7 @@
             <right-toolbar v-if="!(config && config.colTopHiddenIcon)" :showSearch.sync="showSearch" @queryTable="renderList" :columns="columns"></right-toolbar>
         </el-row>
         <!-- 表格数据 -->
-        <el-table v-loading="loading" :data="tableList" ref="selChangeList" highlight-selection-row @selection-change="handleSelectionChange">
+        <el-table height="80%" v-loading="loading" :data="tableList" ref="selChangeList" highlight-selection-row @selection-change="handleSelectionChange">
             <el-table-column v-if="!(config && config.colHiddenCheck)" fixed type="selection" width="55" align="center" />
             <template v-for="(column, key, index) of columns">
                 <el-table-column v-if="column && column.visible" :label="column.label" :key="key" :prop="key" :width="column.width" :min-width="column.minWidth || '100px'" align="left" :show-overflow-tooltip="true">
@@ -47,7 +47,19 @@
                 </template>
             </el-table-column>
         </el-table>
-        <pagination v-show="queryParams.total > 0" :total="queryParams.total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="renderList" />
+        <pagination v-show="queryParams.total > 0" :layout="queryParams && queryParams.layout" :total="queryParams.total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="renderList" />
+
+        <el-dialog title="导出项" :visible.sync="dialogOpen" width="800px" append-to-body>
+          <el-checkbox-group v-model="checkColumns">
+            <template v-for="(item, key, index) of columns">
+              <el-checkbox v-if="key !== 'id'" :label="key" :key="key" style="width: 25%;margin-right: 0px;">{{item.label}}</el-checkbox>
+            </template>
+          </el-checkbox-group>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="diaColSubmit">确 定</el-button>
+            <el-button @click="diaColCancel">取 消</el-button>
+          </div>
+        </el-dialog>
     </div>
 </template>
 
@@ -66,9 +78,10 @@
           queryParams: {
               type: Object,
               default: {
-                  total: 0,
-                  pageNum: 1,
-                  pageSize: 10,
+                total: 0,
+                pageNum: 1,
+                pageSize: 10,
+                layout: 'total, sizes, prev, pager, next, jumper'
               }
           },
           config: {
@@ -83,9 +96,11 @@
         return {
           loading: false,
           showSearch: true,
+          dialogOpen: false,
           ids: [],
           selectList: [],
           isProcessing: false,  // 防止事件循环的标志位
+          checkColumns: []
         }
       },
       // 监听showSearch的变化，并且把变化后的值传给父组件
@@ -98,8 +113,35 @@
       },
       methods: {
         // 所有方法都抛出到父组件里去
-        handleClick(item, row) {
-          this.$emit("fnClick", item, row, this.ids, this.selectList);
+        handleClick(result, row) {
+          if (result && result.fnCode) {
+            switch (result.fnCode) {
+              case 'export':
+                this.dialogOpen = true;
+                this.diaColumnCheck();
+                break;
+              default:
+                this.$emit("fnClick", result, row, this.ids, this.selectList);
+            }
+          }
+        },
+        // 导出弹窗 默认选中项
+        diaColumnCheck() {
+          this.checkColumns = [];
+          Object.keys(this.columns).forEach(item => {
+            if (item !== 'id' && this.columns[item] && this.columns[item].visible) {
+              this.checkColumns.push(item);
+            }
+          });
+        },
+        // 弹窗确认
+        diaColSubmit(){
+          this.$emit("fnClick", {fnCode: 'export'}, {properties: this.checkColumns});
+          this.dialogOpen = false;
+        },
+        // 弹窗取消
+        diaColCancel() {
+          this.dialogOpen = false;
         },
 
         /** 多选框选中数据 */