fix some issues

package-lock.json

@@ -11246,6 +11246,11 @@
         "is-plain-obj": "^1.0.0"
       }
     },
+    "sortablejs": {
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.14.0.tgz",
+      "integrity": "sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w=="
+    },
     "source-list-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",

package.json

@@ -29,6 +29,7 @@
         "cytoscape-spread": "^3.0.0",
         "cytoscape-springy": "^1.4.2",
         "cytoscape-undo-redo": "^1.3.1",
+        "d3": "3.5.12",
         "d3-save-svg": "0.0.2",
         "echarts": "^4.1.0",
         "echarts-gl": "^1.1.1",
@@ -38,14 +39,14 @@
         "konva": "^2.5.0",
         "lodash": "^4.17.4",
         "raven-js": "^3.20.1",
+        "sortablejs": "^1.14.0",
         "v-distpicker": "^1.0.16",
         "vue": "^2.5.17",
         "vue-awesome-swiper": "^3.1.3",
         "vue-multiselect": "^2.0.6",
         "vue-router": "^3.0.1",
         "vuex": "^3.0.1",
-        "xlsx": "^0.11.14",
-        "d3": "3.5.12"
+        "xlsx": "^0.11.14"
     },
     "devDependencies": {
         "autoprefixer": "^7.1.2",

src/components/DragTable.vue

@@ -0,0 +1,240 @@
+<template>
+    <div class="w-table" :class="{'w-table_moving': dragState.dragging}">
+        <el-table 
+            :data="data"
+            :border="option.border"
+            :height="option.height"
+            :max-height="option.maxHeight"
+            :style="{ width: parseInt(option.width)+'px' }"   
+            :cell-class-name="cellClassName" 
+            :header-cell-class-name="headerCellClassName">
+                <slot name="fixed"></slot>
+                <el-table-column v-for="(col, index) in tableHeader" :key="index"
+                    :prop="col.prop"
+                    :label="col.label"
+                    :width="col.width"
+                    :min-width="col.minWidth"
+                    :type="col.type"
+                    :header-align="col.headerAlign"
+                    :column-key="index.toString()"
+                    :render-header="renderHeader"
+                > </el-table-column>
+        </el-table>
+    </div>
+    
+</template>
+
+<script>
+    export default {
+        props: {
+            data: {
+                default: function () {
+                    return []
+                },
+                type: Array
+            },
+            header: {
+                default: function () {
+                    return []
+                },
+                type: Array
+            },
+            option: {
+                default: function () {
+                    return {
+                        border: true,
+                        maxHeight: 500
+                    }
+                },
+                type: Object
+            }
+        },
+        watch: {
+            header (val, oldVal) {
+                this.tableHeader = val
+            }
+        },
+        data() {
+            return {
+                tableHeader: this.header,
+                dragState: {
+                    start: -9, // 起始元素的 index
+                    end: -9, // 移动鼠标时所覆盖的元素 index
+                    dragging: false, // 是否正在拖动
+                    direction: undefined // 拖动方向
+                },
+            };
+        },
+        mounted() {
+            
+        },
+        methods: {
+            // 按下鼠标开始拖动
+            handleMouseDown (e, column) {
+                this.dragState.dragging = true
+                this.dragState.start = parseInt(column.columnKey)
+                // 给拖动时的虚拟容器添加宽高
+                let table = document.getElementsByClassName('w-table')[0]
+                let virtual = document.getElementsByClassName('virtual')
+                for (let item of virtual) {
+                    item.style.height = table.clientHeight - 1 + 'px'
+                    item.style.width = item.parentElement.parentElement.clientWidth + 'px'
+                }　
+                document.addEventListener('mouseup', this.handleMouseUp);
+            },
+
+            // 鼠标放开结束拖动
+            handleMouseUp () {
+                this.dragColumn(this.dragState)
+                // 初始化拖动状态
+                this.dragState = {
+                    start: -9,
+                    end: -9,
+                    dragging: false,
+                    direction: undefined
+                }　
+                document.removeEventListener('mouseup', this.handleMouseUp);
+            },
+            // 拖动中
+            handleMouseMove (e, column) {
+                if (this.dragState.dragging) {
+                    let index = parseInt(column.columnKey) // 记录起始列
+                    if (index - this.dragState.start !== 0) {
+                        this.dragState.direction = index - this.dragState.start < 0 ? 'left' : 'right' // 判断拖动方向
+                        this.dragState.end = parseInt(column.columnKey)
+                    } else {
+                        this.dragState.direction = undefined
+                    }
+                } else {
+                    return false
+                }
+            },
+
+            // 拖动易位
+            dragColumn ({start, end, direction}) {
+                let tempData = []
+                let left = direction === 'left'
+                let min = left ? end : start - 1
+                let max = left ? start + 1 : end
+                for (let i = 0; i < this.tableHeader.length; i++) {
+                    if (i === end) {
+                        tempData.push(this.tableHeader[start])
+                    } else if (i > min && i < max) {
+                        tempData.push(this.tableHeader[ left ? i - 1 : i + 1 ])
+                    } else {
+                        tempData.push(this.tableHeader[i])
+                    }
+                }
+                this.tableHeader = tempData
+            },
+            renderHeader (createElement, {column}) {
+                return createElement(
+                    'div', {
+                        'class': ['thead-cell'],
+                        on: {
+                            mousedown: ($event) => { this.handleMouseDown($event, column) },
+                            mousemove: ($event) => { this.handleMouseMove($event, column) }
+                        }
+                    }, 
+                    [
+                        // 添加 <a> 用于显示表头 label
+                        createElement('a', column.label),
+                        // 添加一个空标签用于显示拖动动画
+                        createElement('span', { 'class': ['virtual'] })
+                    ]
+                )
+            },
+            headerCellClassName ({column, columnIndex}) {
+                let active = columnIndex - 1 === this.dragState.end ? `darg_active_${this.dragState.direction}` : ''
+                let start = columnIndex - 1 === this.dragState.start ? `darg_start` : ''
+                return `${active} ${start}`
+            },
+
+            cellClassName ({column, columnIndex}) {
+                return (columnIndex - 1 === this.dragState.start ? `darg_start` : '')
+            },
+            onOpen(){
+                let fileObj = this.$store.getters.getCurrentFile;
+                let payload = {
+                    page:1,
+                    pageSize:20,
+                    fileId:fileObj.id,
+                }
+                this.currentFileName = fileObj.filename;
+                this.loadTableDataById(payload)
+            },
+            loadTableDataById(payload){
+                const loading = this.$loading({
+                    lock: true,
+                    text: "请耐心等待，正在加载数据。。",
+                    spinner: "el-icon-loading",
+                    background: "rgba(0, 0, 0, 0.7)"
+                });
+                this.beforePayload = payload
+                this.$store.dispatch("view_file_content_by_id", this.setModelId(payload)).then(data => {
+                    loading.close();
+                    if (data.code == 200) {
+                        this.$store.commit("set_file_content_by_id", data);
+                    } else {
+                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
+                    }
+                });
+            },
+        }
+    };
+</script>
+<style lang="less">
+    .w-table {　
+        .el-table .darg_start {   
+            background-color: #f3f3f3;   
+        }
+        .el-table th {
+            padding: 0;
+            .virtual{
+                position: fixed;
+                display: block;
+                width: 0;
+                height: 0;
+                margin-left: -10px;
+                background: none;
+                border: none;
+            }
+            &.darg_active_left {
+                .virtual {
+                    border-left: 2px dotted #666;
+                    z-index: 99;
+                }
+            }
+            &.darg_active_right {
+                .virtual {
+                    border-right: 2px dotted #666;
+                    z-index: 99;
+                }
+            }
+        }
+        .thead-cell {
+            padding: 0;
+            display: inline-flex;
+            flex-direction: column;
+            align-items: left;
+            cursor: pointer;
+            overflow: initial;
+            &:before {
+                content: "";
+                position: absolute;
+                top: 0;
+                left: 0;
+                bottom: 0;
+                right: 0;
+            }
+        }
+        &.w-table_moving {
+            .el-table th .thead-cell{
+                cursor: move !important;
+            }
+            .el-table__fixed {
+                cursor: not-allowed;
+            }
+        }
+    }
+</style>

src/components/Pagination.vue

@@ -3,7 +3,7 @@
         <el-pagination 
             @size-change="handleSizeChange" 
             @current-change="handleCurrentChange"
-            :current-page.sync="dataList.currentPage" 
+            :current-page.sync="dataList.page" 
             :page-size="dataList.pageSize"
             :page-sizes="pageSizes" 
             :layout="simple ? layoutStr2 : layoutStr1"

src/modules/Home.vue

@@ -108,7 +108,7 @@
                     return this.$store.getters.getCurrentModelGroup.modelName;
                 },
                 set(val) {
-                    console.log(this.$store.getters.getCurrentModelGroup);
+                    //console.log(this.$store.getters.getCurrentModelGroup);
                 }
             },
         },

src/modules/createmodel/alipay/components/ResultTable.vue

@@ -4,6 +4,7 @@
             
             <file-name></file-name>
             <search-sort></search-sort>
+
             <el-collapse v-model="collapseName">
                 <el-collapse-item title="操作" name="1">
                     <br>
@@ -15,9 +16,10 @@
                     <br>
                 </el-collapse-item>
                 <el-collapse-item title="结果" name="2">
-                    <el-table element-loading-text="数据加载中" element-loading-spinner="el-icon-loading"
-                        :data="fileContent.result" border size="mini" height="400" max-height="700" tooltip-effect="dark"
-                        ref="detailTable" highlight-current-row style="width: 100%">
+                    <el-table :data="fileContent.result" 
+                        border size="mini" height="460" tooltip-effect="dark"
+                        :key="currentFileName" style="width: 100%"
+                        ref="alipayTable" highlight-current-row>
                         <template v-for="(key, value) in fileContent.header">
                             <el-table-column 
                                 :prop="value" 
@@ -28,7 +30,7 @@
                             </el-table-column> 
                         </template>
                     </el-table>
-                    <pagination :dataList="fileContent" :upParam="beforePayload" @loadMethod="loadTableDataById"></pagination>
+                    <pagination :dataList="fileContent" :upParam="beforePayload" @loadMethod="loadSearchSortData"></pagination>
                 </el-collapse-item>
             </el-collapse>
         </div>
@@ -39,6 +41,7 @@
     import pagination from "@/components/Pagination.vue";
     import searchSort from "./SearchSort.vue";
     import fileName from "../../components/FileName.vue";
+    import { downloadAndDeleteById } from '@/service/createmodel/fileService.js'
 
     export default {
         components: {
@@ -75,73 +78,65 @@
             openSettings(){
                 this.$store.commit('is_search_sort_settings', true)
             },
-            // showInput() {
-            //     this.inputVisible = true;
-            //     this.$nextTick(_ => {
-            //         this.$refs.saveTagInput.$refs.input.focus();
-            //     });
-            // },
             oneKeyGenerate(){
-                this.loadAlipayTableByType({
-                    num: 2,
-                    dispatchStr: 'get_alipay_tables'
-                })
+                const loading = this.$loading({
+                    lock: true,
+                    text: "请耐心等待，正在加载数据。。",
+                    spinner: "el-icon-loading",
+                    background: "rgba(0, 0, 0, 0.7)"
+                });
+                this.$store.dispatch('get_alipay_tables', this.setModelId({})).then(data => {
+                    if (data.code == 200) {
+                        this.$store.dispatch("view_files_list", this.setModelId({ page:1, pageSize:20 })).then(res => {
+                            loading.close();
+                            if (res.code == 200) {
+                                this.$store.commit("set_files_list", res);
+                            } else {
+                                this.$message({ type: "error",  message: res.message ? res.message : "加载失败" });
+                            }
+                        });
+                    } else {
+                        loading.close()
+                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
+                    }
+                });
             },
             exportFile(){
-                let payload = this.$store.getters.getBasicParams;
+                let payload = this.$store.getters.getUpSearchSortParams;
                 if(payload.fileId){
                     this.exportFileById(payload)
                 }
             },
             exportFileById(payload){
-                this.$store.dispatch("get_alipay_tables", this.setModelId(payload)).then(data => {
-                    if (data.code == 200) {
-                        if(data.result.id){
-
-                        } else {
-                           this.$message({ type: "error",  message: data.message ? data.message : "加载失败" }); 
-                        }
-                    } else {
-                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
-                    }
-                });
-            },
-
-            
-            loadFLTable(payload){
                 const loading = this.$loading({
                     lock: true,
                     text: "请耐心等待，正在加载数据。。",
                     spinner: "el-icon-loading",
                     background: "rgba(0, 0, 0, 0.7)"
                 });
-                this.$store.dispatch("view_files_list", this.setModelId(payload)).then(data => {
+                this.$store.dispatch("export_by_query", this.setModelId(payload)).then(data => {
                     loading.close();
                     if (data.code == 200) {
-                        this.$store.commit("set_files_list", data);
-                    } else {
-                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
-                    }
-                });
-            },
-            loadAlipayTableByType(typeObj){
-                let { num, dispatchStr } = typeObj 
-                let payload = { num: num }
-                this.$store.dispatch(dispatchStr, this.setModelId(payload)).then(data => {
-                    if (data.code == 200) {
-                        this.loadFLTable({ page:1, pageSize:20 })
+                            let iframe = document.createElement('iframe');
+                            iframe.style.display = 'none';
+                            iframe.src = downloadAndDeleteById + '?id='+data.result;
+                            iframe.id = 'myIframe2';
+                            document.body.appendChild(iframe);
                     } else {
                         this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
                     }
                 });
             },
+
             loadInitTable(){
                 let payload = this.$store.getters.getBasicParams;
-                if(payload.fileId){
-                    this.loadTableDataById(payload)
+                if(payload && payload.fileId){
+                    this.loadSearchSortData(payload)
                 }
             },
-            loadTableDataById(payload){
+
+            // 搜索排序加载文件
+            loadSearchSortData(payload){
                 const loading = this.$loading({
                     lock: true,
                     text: "请耐心等待，正在加载数据。。",
@@ -149,14 +144,20 @@
                     background: "rgba(0, 0, 0, 0.7)"
                 });
 
-                let upPayload = this.$store.getters.getBasicParams;
-                payload.fileId = upPayload.fileId;
+                let upSearchSortParams = this.$store.getters.getUpSearchSortParams;
+                let currentFile = this.$store.getters.getCurrentFile;
 
+                payload.fileId = currentFile.id;
+                payload.orders = upSearchSortParams.orders;
+                payload.values = upSearchSortParams.values;
+                payload.mode = upSearchSortParams.mode;
+                
                 this.beforePayload = payload
-                this.$store.dispatch("view_file_content_by_id", this.setModelId(payload)).then(data => {
-                    loading.close();
+
+                this.$store.dispatch('view_data_by_query', this.setModelId(payload)).then(data => {
+                    loading.close()
                     if (data.code == 200) {
-                        this.$store.commit("set_file_content_by_id", data);
+                       this.$store.commit("set_file_content_by_id", data);
                     } else {
                         this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
                     }

src/modules/createmodel/alipay/components/SearchSort.vue

@@ -9,7 +9,6 @@
         size="500">
 
         <el-card>
-
             <div slot="header" class="clearfix" style="font-size:16px;">
                 <span>搜索</span>&nbsp;&nbsp; <el-switch v-model="isAndOr" active-color="orange" inactive-color="#409EFF"></el-switch>
                 <span style="font-size:14px;color:orange;">{{isAndOr ? '交集' : '并集'}}</span>
@@ -112,9 +111,26 @@
             //
         },
         methods: {
+            loadSearchSortData(payload){
+                const loading = this.$loading({
+                    lock: true,
+                    text: "请耐心等待，正在加载数据。。",
+                    spinner: "el-icon-loading",
+                    background: "rgba(0, 0, 0, 0.7)"
+                });
+                this.$store.dispatch('view_data_by_query', this.setModelId(payload)).then(data => {
+                    loading.close()
+                    if (data.code == 200) {
+                       this.$store.commit("set_file_content_by_id", data);
+                    } else {
+                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
+                    }
+                });
+            },
             searchSort(num){
-                let upParams = this.$store.getters.getBasicParams;
-                let payload = { page: 1,pageSize:20, orders:[], values:[], fileId: upParams.fileId,mode:isAndOr?'and':'or'}
+                let currentFile = this.$store.getters.getCurrentFile;
+                let payload = { page: 1,pageSize:20, orders:[], values:[], fileId: currentFile.id,mode:this.isAndOr?'and':'or'}
+                
                 this.searchList.forEach((item)=>{
                     payload.values.push({
                         field:item.label,
@@ -123,6 +139,7 @@
                         value:item.value
                     })
                 })
+
                 this.sortList.forEach((item)=>{
                     payload.orders.push({
                         field:item.label,
@@ -130,13 +147,8 @@
                         mode:item.rule
                     })
                 })
-                this.$store.dispatch('view_data_by_query', this.setModelId(payload)).then(data => {
-                    if (data.code == 200) {
-                       this.$store.commit("set_file_content_by_id", data);
-                    } else {
-                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
-                    }
-                });
+                this.$store.commit("set_up_search_sort_params", payload);
+                this.loadSearchSortData(payload)
             },
             deleteItem(num, item){
                 if(num == 1){

src/modules/createmodel/components/FileTable.vue

@@ -81,21 +81,32 @@
                     pageSize:20,
                     fileId:row.id
                 }
-                this.$store.commit("set_file_content_basicParams", payload); // 保存文件基础信心
-                this.loadTableDataById(payload) // 加载文件内容
+                this.$store.commit('set_up_search_sort_params', payload); // 保存文件基础信心
+                this.loadSearchSortData(payload) // 加载文件内容
                 this.loadTableHeaderDataById(payload) // 加载文件headers
             },
-            loadTableDataById(payload){
+            // 搜索排序加载文件
+            loadSearchSortData(payload){
                 const loading = this.$loading({
                     lock: true,
                     text: "请耐心等待，正在加载数据。。",
                     spinner: "el-icon-loading",
                     background: "rgba(0, 0, 0, 0.7)"
                 });
-                this.$store.dispatch("view_file_content_by_id", this.setModelId(payload)).then(data => {
-                    loading.close();
+
+                let upSearchSortParams = this.$store.getters.getUpSearchSortParams;
+                let currentFile = this.$store.getters.getCurrentFile;
+
+                payload.fileId = currentFile.id;
+                payload.orders = upSearchSortParams.orders;
+                payload.values = upSearchSortParams.values;
+                payload.mode = upSearchSortParams.mode;
+                
+                this.beforePayload = payload
+                this.$store.dispatch('view_data_by_query', this.setModelId(payload)).then(data => {
+                    loading.close()
                     if (data.code == 200) {
-                        this.$store.commit("set_file_content_by_id", data);
+                       this.$store.commit("set_file_content_by_id", data);
                     } else {
                         this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
                     }
@@ -114,7 +125,6 @@
                     loading.close();
                     if (data.code == 200) {
                         this.$store.commit('set_table_header', data.result.fields)
-                        this.$message({ type: "success",  message: data.message ? data.message : "成功" });
                     } else {
                         this.$message({ type: "error",  message: data.message ? data.message : "失败" });
                     }

src/modules/createmodel/file/components/DetailTable.vue

@@ -0,0 +1,113 @@
+<template>
+    <el-dialog 
+        :append-to-body="true" 
+        :title="currentFileName"  
+        width="80%"
+        :visible.sync="isDetailCon"
+        @open="onOpen"
+        :show-close="true" >
+            <el-table :data="fileContent.result" size="mini" 
+                height="600" tooltip-effect="dark" ref="fileTable" :key="currentFileName + '2'" 
+                highlight-current-row style="width: 100%">
+                <template v-for="(key, value) in fileContent.header">
+                    <el-table-column 
+                        :prop="value" 
+                        :label="key" 
+                        :min-width="150" 
+                        :show-overflow-tooltip="true" 
+                        :key="value">
+                    </el-table-column> 
+                </template>
+            </el-table>
+            <pagination :dataList="fileContent" :upParam="beforePayload" @loadMethod="loadTableDataById"></pagination>
+            <!-- <dTable :data="tableData" :header="tableHeader" ></dTable> -->
+    </el-dialog>
+</template>
+
+<script>
+    import pagination from "@/components/Pagination.vue";
+    import dTable from "@/components/DragTable.vue";
+    export default {
+        components: {
+            pagination,
+            dTable
+        },
+        data() {
+            return {
+                sortable:'',
+                beforePayload:{
+                    page:1,
+                    pageSize:20
+                },
+                currentFileName:'',
+
+                tableHeader: [ ],
+                tableData: [ ]
+            };
+        },
+        computed: {
+            fileContent: {
+                get() {
+                    return this.$store.getters.getFileContentById;
+                }
+            },
+            isDetailCon:{
+                get() {
+                    return this.$store.getters.getIsDetailTable;
+                },
+                set(val) {
+                    this.$store.commit("is_detail_table_con", false);
+                }
+            }
+        },
+        mounted() {
+
+        },
+        methods: {
+            alertMsg(){
+                console.log('just for test drag')
+            },
+            onOpen(){
+                let fileObj = this.$store.getters.getCurrentFile;
+                let payload = {
+                    page:1,
+                    pageSize:20,
+                    fileId:fileObj.id,
+                }
+                this.currentFileName = fileObj.filename;
+                this.loadTableDataById(payload)
+            },
+            loadTableDataById(payload){
+                const loading = this.$loading({
+                    lock: true,
+                    text: "请耐心等待，正在加载数据。。",
+                    spinner: "el-icon-loading",
+                    background: "rgba(0, 0, 0, 0.7)"
+                });
+                let fileObj = this.$store.getters.getCurrentFile;
+                payload.fileId = fileObj.id
+                this.beforePayload = payload
+                this.$store.dispatch("view_file_content_by_id", this.setModelId(payload)).then(data => {
+                    loading.close();
+                    if (data.code == 200) {
+                        this.$store.commit("set_file_content_by_id", data);
+                        // just for test
+                        // this.tableData = data.result
+                        // let headers = data.header
+                        // let tempArr = []
+                        // for(let key in headers){
+                        //     tempArr.push({
+                        //         prop: key,
+                        //         label: headers[key],
+                        //         minWidth: '120',
+                        //     })
+                        // }
+                        // this.tableHeader = [...tempArr]
+                    } else {
+                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
+                    }
+                });
+            },
+        }
+    };
+</script>

src/modules/createmodel/file/components/ImportFile.vue

@@ -49,20 +49,9 @@
 
         data() {
             return {
-                // myload: null,
-                // uploadForm: null,
-                // fileIds: [],
-                // openFiles: false,
-                // addm: false,
-                // show_progress: false,
-                // fileKeyWords: "",
                 apiUrl: apiUrl,
-                // nowIndex: 0,
                 uploading: false,  //上传过程按钮 loading 状态
                 hasClose: true,  //上传过程（无头部X关闭按钮 ，以及点击空白地方无法关闭） 只能点击取消关闭弹框 ，
-                // successNum: 0,
-                // errorNum: 0,
-                // cancelName: "取消"
                 modelId:{
                     modelId:this.$store.getters.getCurrentModelGroup.id
                 }
@@ -91,24 +80,16 @@
         },
         methods: {
             handleClose(done) {
-                // this.cancelName = "取消";
                 this.$store.commit("set_import_on", false);
                 this.uploading = false;
                 this.hasClose = true;
-                // this.uploadForm = null;
-                // this.myload = null;
-                // this.fileIds = [];
                 this.$refs.upload.clearFiles();
                 done();
             },
             cancel(type) {
                 this.$store.commit("set_import_on", false);
-                // this.cancelName = "取消";
                 this.uploading = false;
                 this.hasClose = true;
-                // this.uploadForm = null;
-                // this.myload = null;
-                // this.fileIds = [];
                 this.$refs.upload.clearFiles();
             },
             handleRemove(file, fileList) {

src/modules/createmodel/file/components/ResultTable.vue

@@ -9,89 +9,65 @@
             </button>
         </div>
         <div class="nb-table nb-table--bgc">
-            <el-table v-loading="loading"  :row-key="getRowKey" element-loading-text="数据加载中" element-loading-spinner="el-icon-loading"
-                :data="fileLists.result" border size="mini" height="650" highlight-current-row
-                max-height="400" tooltip-effect="dark" ref="fileListsTable" 
-                @selection-change="handleFLSelectionChange" style="width: 100%">
-                <!-- <el-table-column type="selection"  :reserve-selection="true"  width="50"></el-table-column> -->
-                <!-- <el-table-column prop="id" class-name="id-key" label="" width="0"></el-table-column> -->
-                <el-table-column prop="count" label="序号" width="80"></el-table-column>
-                <el-table-column prop="filename" label="文件名称" :show-overflow-tooltip="true" min-width="120">
-                </el-table-column>
-                <el-table-column prop="modelName" label="分组名称" :show-overflow-tooltip="true" min-width="120">
-                </el-table-column>
-                <el-table-column prop="uploadDate" label="创建时间" :show-overflow-tooltip="true" min-width="120">
-                </el-table-column>
-                <el-table-column prop="generatedStr" label="类型" min-width="80">
-                    <template slot-scope="scope">
-                        <el-tag effect="dark" size="mini" :type="scope.row.generatedStr === '生成' ? 'primary' : 'success'" disable-transitions>
-                            {{scope.row.generatedStr}}
-                        </el-tag>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="filename" label="操作" min-width="170">
-                    <template slot-scope="scope">
-                        <el-button @click="deleteLeftFile(scope.row)" type="success" round size="mini">删除</el-button>
-                        <el-button @click="viewFileById(scope.row)" type="success" round size="mini">查看</el-button>
-                        <el-button @click="downloadFileById(scope.row)" type="success" round size="mini">下载</el-button>
-                    </template>
-                </el-table-column>
+            <el-table 
+                :data="fileLists.result" 
+                border 
+                size="mini" 
+                height="560" 
+                highlight-current-row
+                tooltip-effect="dark" 
+                ref="fileListsTable" 
+                style="width: 100%">
+                    <!-- <el-table-column type="selection"  :reserve-selection="true"  width="50"></el-table-column> -->
+                    <!-- <el-table-column prop="id" class-name="id-key" label="" width="0"></el-table-column> -->
+                    <el-table-column prop="count" label="序号" width="80"></el-table-column>
+                    <el-table-column prop="filename" label="文件名称" :show-overflow-tooltip="true" min-width="120">
+                    </el-table-column>
+                    <el-table-column prop="modelName" label="分组名称" :show-overflow-tooltip="true" min-width="120">
+                    </el-table-column>
+                    <el-table-column prop="uploadDate" label="创建时间" :show-overflow-tooltip="true" min-width="120">
+                    </el-table-column>
+                    <el-table-column prop="generatedStr" label="类型" min-width="80">
+                        <template slot-scope="scope">
+                            <el-tag effect="dark" size="mini" 
+                            :type="scope.row.generatedStr === '生成' ? 'primary' : 'success'" 
+                            disable-transitions>
+                                {{scope.row.generatedStr}}
+                            </el-tag>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="filename" label="操作" min-width="170">
+                        <template slot-scope="scope">
+                            <el-button @click="deleteLeftFile(scope.row)" type="success" round size="mini">删除</el-button>
+                            <el-button @click="viewFileById(scope.row)" type="success" round size="mini">查看</el-button>
+                            <el-button @click="downloadFile(scope.row)" type="success" round size="mini">下载</el-button>
+                        </template>
+                    </el-table-column>
             </el-table>
-            <pagination :dataList="fileLists" :upParam="beforeFLPayload" @loadMethod="loadFLTable"></pagination>
+            <pagination :dataList="fileLists" :upParam="beforePayload" @loadMethod="loadFLTable"></pagination>
         </div>
-        <el-dialog 
-            :append-to-body="true" :title="currentFileName"  width="80%"
-            :visible.sync="showFileDetail"
-            :show-close="true" >
-                <el-table v-loading="loading" element-loading-text="数据加载中" element-loading-spinner="el-icon-loading"
-                    :data="fileContent.result" border size="mini" height="500" max-height="700" tooltip-effect="dark"
-                    ref="detailTable" highlight-current-row style="width: 100%">
-                    <template v-for="(key, value) in fileContent.header">
-                        <el-table-column 
-                            :prop="value" 
-                            :label="key" 
-                            :min-width="150" 
-                            :show-overflow-tooltip="true" 
-                            :key="value">
-                        </el-table-column> 
-                    </template>
-                </el-table>
-                <pagination :dataList="fileContent" :upParam="beforePayload" @loadMethod="loadTableDataById"></pagination>
-        </el-dialog>
+        <detail-table></detail-table>
     </div>
 </template>
 
 <script>
-    import {
-        downloadClearStandardExcel
-    } from "@/service/createmodel/fileService.js";
-
     import pagination from "@/components/Pagination.vue";
+    import { downloadAndDeleteById } from '@/service/createmodel/fileService.js'
+    import detailTable from './DetailTable.vue'
     export default {
         components: {
-            pagination
+            pagination,
+            detailTable,
         },
         data() {
             return {
-                pageSizes: this.$store.getters.getpageSizes, 
                 beforePayload:{
                     page:1,
                     pageSize:20
                 },
-                loading:false,
-                currentFileName:'',
-                beforeFLPayload:{},
-
-                currentModel:this.$store.getters.getCurrentModelGroup,
-                showFileDetail:false,
             };
         },
         computed: {
-            fileContent: {
-                get() {
-                    return this.$store.getters.getFileContentById;
-                }
-            },
             fileLists: {
                 get() {
                     let fileLists = this.$store.getters.getFilesList;
@@ -103,18 +79,12 @@
             this.loadFLTable({ page:1,pageSize:20})
         },
         methods: {
-            // 进入分析创建模型
             createmodel(){
                 this.$router.push('/model');
             },
-            // 导入文件
-            openImport(type) {
-                this.theType = type
+            openImport() {
                 this.$store.commit("set_import_on", true);
             },
-            // 文件列表三个change
-            handleFLSelectionChange(){
-            },
             loadFLTable(payload){
                 const loading = this.$loading({
                     lock: true,
@@ -122,7 +92,7 @@
                     spinner: "el-icon-loading",
                     background: "rgba(0, 0, 0, 0.7)"
                 });
-                this.beforeFLPayload = payload
+                this.beforePayload = payload
                 this.$store.dispatch("view_files_list", this.setModelId(payload)).then(data => {
                     loading.close();
                     if (data.code == 200) {
@@ -132,70 +102,41 @@
                     }
                 });
             },
-            deleteLeftFile(file){
-                let currentModel = this.$store.getters.getCurrentModelGroup
-                let payload = {
-                    id: file.id,
-                    modelId: currentModel.id
-                }
-                
-                this.deleteFileById(payload)
-            },
+            // 查看文件
             viewFileById(file){
-                let currentModel = this.$store.getters.getCurrentModelGroup
-                let payload = {
-                    page:1,
-                    pageSize:20,
-                    fileId:file.id,
-                    modelId:currentModel.id
-                }
-                
-                this.showFileDetail = true;
-                this.currentFileName = file.filename;
-                this.loadTableDataById(payload)
+                this.$store.commit("is_detail_table_con", true);
+                this.$store.commit('set_current_fileobj', file) 
             },
-            downloadFileById(file){
-                let currentModel = this.$store.getters.getCurrentModelGroup
-                let payload = {
-                    id:file.id,
-                    modelId:currentModel.id
-                }
-                this.showFileDetail = true;
-                this.downloadFileById(payload)
-            },
-
-            getRowKey(row) {
-                return row.id
-            },
-
-            downloadFileById(payload){
+            // 下载文件
+            downloadFile(file){
                 const loading = this.$loading({
                     lock: true,
-                    text: "请耐心等待。。",
+                    text: "请耐心等待，正在加载数据。。",
                     spinner: "el-icon-loading",
                     background: "rgba(0, 0, 0, 0.7)"
                 });
-                this.$store.dispatch("download_file_by_id", this.setModelId(payload)).then(data => {
+                this.$store.dispatch("export_by_query", this.setModelId({ id: file.id, fileId: file.id })).then(data => {
                     loading.close();
                     if (data.code == 200) {
-                        let iframe = document.createElement("iframe");
-                        iframe.style.display = "none";
-                        iframe.src = downloadClearStandardExcel;
-                        iframe.id = "myIframe";
-                        document.body.appendChild(iframe);
+                            let iframe = document.createElement('iframe');
+                            iframe.style.display = 'none';
+                            iframe.src = downloadAndDeleteById + '?id='+data.result;
+                            iframe.id = 'myIframe2';
+                            document.body.appendChild(iframe);
                     } else {
-                        this.$message({ type: "error",  message: data.message ? data.message : "失败" });
+                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
                     }
                 });
             },
-            deleteFileById(payload){
+            // 删除文件
+            deleteLeftFile(file){
                 const loading = this.$loading({
                     lock: true,
                     text: "请耐心等待。。",
                     spinner: "el-icon-loading",
                     background: "rgba(0, 0, 0, 0.7)"
                 });
-                this.$store.dispatch("delete_file_by_id", this.setModelId(payload)).then(data => {
+                this.$store.dispatch("delete_file_by_id", this.setModelId({id:file.id})).then(data => {
                     loading.close();
                     if (data.code == 200) {
                         this.loadFLTable({page:1,pageSize:20})
@@ -205,24 +146,6 @@
                     }
                 });
             },
-
-            loadTableDataById(payload){
-                const loading = this.$loading({
-                    lock: true,
-                    text: "请耐心等待，正在加载数据。。",
-                    spinner: "el-icon-loading",
-                    background: "rgba(0, 0, 0, 0.7)"
-                });
-                this.beforePayload = payload
-                this.$store.dispatch("view_file_content_by_id", this.setModelId(payload)).then(data => {
-                    loading.close();
-                    if (data.code == 200) {
-                        this.$store.commit("set_file_content_by_id", data);
-                    } else {
-                        this.$message({ type: "error",  message: data.message ? data.message : "加载失败" });
-                    }
-                });
-            },
         }
     };
 </script>

src/modules/createmodel/model/components/ResultTable.vue

@@ -155,7 +155,7 @@
         border-color: #3a8ee6;
         background: #3a8ee6;
     }
-    .th-wrapper{
+    .th-wrapper {
         position: relative;
         width: 100%;
     }
@@ -198,9 +198,6 @@
         line-height: 56px;
         margin-right: 180px;
     }
-    .el-tag + .el-tag {
-        margin-left: 10px;
-    }
     .button-new-tag {
         margin-left: 10px;
         height: 32px;

src/service/createmodel/fileService.js

@@ -16,15 +16,17 @@ var viewFileContentById = payload => Fetch('POST', apiUrl + 'data/viewDataByFile
 var clearFilesList = payload => Fetch('POST', apiUrl + 'view/clear', payload)
 //4.删除某个文件
 var deleteFilesById = payload => Fetch('POST', apiUrl + 'file/deleteById', payload)
-//4.下载某个文件
+//5.下载某个文件
 var downLoadFilesById = payload => Fetch('POST', apiUrl + 'file/downloadById', payload)
 
-
 //7.某个文件的搜索排序
 var viewDataByQuery = payload => Fetch('POST', apiUrl + 'data/viewDataByQuery', payload)
+//8.生成要导出的文件搜索排序
+var exportByQuery = payload => Fetch('POST', apiUrl + 'data/exportByQuery', payload)
+//9.下载文件
+// var downloadAndDeleteById = payload => Fetch('GET', apiUrl + 'file/downloadAndDeleteById', payload)
 
-var downloadClearStandardExcel = apiUrl + 'datacleaning/down'
-
+var downloadAndDeleteById = apiUrl + 'file/downloadAndDeleteById'
 var downloadFiles = apiUrl + 'view/downloadFile'
 
 export {
@@ -34,8 +36,9 @@ export {
     clearFilesList,
     deleteFilesById,
     downLoadFilesById,
-    downloadClearStandardExcel,
+    downloadAndDeleteById,
     viewDataByQuery,
+    exportByQuery,
 
     downloadFiles,
 }

src/service/createmodel/modelService.js

@@ -11,7 +11,6 @@ import {
 var getHeadersById = payload => Fetch('POST', apiUrl + 'data/viewHeaders', payload)
 
 
-
 export {
     /*****导入模块*********/
     getHeadersById,

src/store/createmodel/aliPayStore.js

@@ -3,11 +3,18 @@ import * as aliPayService from '@/service/createmodel/aliPayService.js'
 export default {
     state: {
         alipayTables: {},
+        upSearchSortParams: {
+            page: 1,
+            pageSize: 20,
+        }
     },
     mutations: {
         set_alipay_tables(state, data) {
             state.alipayTables = data
         },
+        set_up_search_sort_params(state, data) {
+            state.upSearchSortParams = data
+        },
     },
     actions: {
         // 一键生成支付宝5张信息表
@@ -23,5 +30,8 @@ export default {
         getAlipayTables(state) {
             return state.alipayTables
         },
+        getUpSearchSortParams(state) {
+            return state.upSearchSortParams
+        },
     }
 }

src/store/createmodel/fileStore.js

@@ -13,8 +13,14 @@ export default {
         },
         fileContent:{"result":[],"pageSize":20,"page":1,"message":""},
         isImportOn: false,
-        basicParams: {},
-        isSearchSort:false,
+        isSearchSort: false,
+        headers: {
+            "f0": "序号",
+        },
+        fileobj: {
+            filename:' '
+        },
+        isDetailTable:false,
     },
     mutations: {
         // ============ 关联模型 ============== 
@@ -34,12 +40,18 @@ export default {
         set_import_on(state, data) {
             state.isImportOn = data
         },
-        set_file_content_basicParams(state, data) {
-            state.basicParams = data
-        },
         is_search_sort_settings(state, data) {
             state.isSearchSort = data
         },
+        set_table_header(state, data) {
+            state.headers = data
+        },
+        set_current_fileobj(state, data) {
+            state.fileobj = data
+        },
+        is_detail_table_con(state, data) {
+            state.isDetailTable = data
+        },
     },
     actions: {
 
@@ -87,14 +99,30 @@ export default {
             return res
         },
         
-         //6.某个文件的搜索排序
-         async view_data_by_query({
+        //6.某个文件的搜索排序
+        async view_data_by_query({
             commit,
             state
         }, payload) {
             let res = await fileService.viewDataByQuery(payload)
             return res
         },
+        //7.某个文件的搜索排序生成导出结果
+        async export_by_query({
+            commit,
+            state
+        }, payload) {
+            let res = await fileService.exportByQuery(payload)
+            return res
+        },
+        //8.某个文件的搜索排序下载文件
+        async download_and_delete_by_id({
+            commit,
+            state
+        }, payload) {
+            let res = await fileService.downloadAndDeleteById(payload)
+            return res
+        },
         
     },
     
@@ -109,12 +137,17 @@ export default {
         getImportOn(state) {
             return state.isImportOn
         },
-        getBasicParams(state) {
-            return state.basicParams
-        },
         getIsSearchSort(state) {
             return state.isSearchSort
         },
-
+        getTableHeaders(state) {
+            return state.headers
+        },
+        getCurrentFile(state) {
+            return state.fileobj
+        },
+        getIsDetailTable(state) {
+            return state.isDetailTable
+        },
     }
 }

src/store/createmodel/modelStore.js

@@ -2,14 +2,7 @@ import * as modelService from '@/service/createmodel/modelService.js'
 
 export default {
     state: {
-        headers: {
-            "f0": "序号",
-            "f1": "开户网点",
-            "f2": "交易卡号",
-          },
-        fileobj: {
-            filename:'0'
-        },
+
         file100data: {
             "result": [],
             "total": 100,
@@ -20,12 +13,7 @@ export default {
         }
     },
     mutations: {
-        set_table_header(state, data) {
-            state.headers = data
-        },
-        set_current_fileobj(state, data) {
-            state.fileobj = data
-        },
+        
         set_current_file100_data(state, data) {
             state.file100data = data
         },
@@ -44,12 +32,7 @@ export default {
     },
     
     getters: {
-        getTableHeaders(state) {
-            return state.headers
-        },
-        getCurrentFile(state) {
-            return state.fileobj
-        },
+
         getFile100Data(state) {
             return state.file100data
         },