Merge remote-tracking branch 'origin/master'

build/utils.js

@@ -15,7 +15,7 @@ const devPathSrc = path.resolve(__dirname, '../../../src') // node_modules应用
 // ['index','appoint'，'configManager','homepage',''inward,'queue','RMS','sale','serviceManager','SporadicManage'
 //       统计报表       组织机构/系统管理 采购  仓储
 //  'statisticalReport','systemConfig','TMS','WMS','workFlow']
-//let devModules = ["index", "statisticalReport", "appoint", "sale","TMS","AMS"];
+//let devModules = ["index", "statisticalReport", "appoint", "sale"];
 let devModules = ['all']
 
 if (pathSrc.indexOf('node_modules') > -1) {

build/webpack.base.conf.js

@@ -1,116 +1,116 @@
-"use strict";
-const path = require("path");
-const utils = require("./utils");
-const config = require("../config");
-const vueLoaderConfig = require("./vue-loader.conf");
-const pathSrc = path.resolve(__dirname, "../src");
+'use strict'
+const path = require('path')
+const utils = require('./utils')
+const config = require('../config')
+const vueLoaderConfig = require('./vue-loader.conf')
+const pathSrc = path.resolve(__dirname, '../src')
 function resolve(dir) {
-  return path.join(__dirname, "..", dir);
+  return path.join(__dirname, '..', dir)
 }
 
 const createLintingRule = () => ({
   test: /\.(js|vue)$/,
-  loader: "eslint-loader",
-  enforce: "pre",
-  include: [resolve("src"), resolve("test")],
+  loader: 'eslint-loader',
+  enforce: 'pre',
+  include: [resolve('src'), resolve('test')],
   options: {
-    formatter: require("eslint-friendly-formatter"),
+    formatter: require('eslint-friendly-formatter'),
     emitWarning: !config.dev.showEslintErrorsInOverlay
   }
-});
+})
 
 let babelLoader = {
   include: [
-    resolve("src"),
-    resolve("test"),
-    resolve("node_modules/webpack-dev-server/client"),
-    resolve("node_modules/vue-element-bigdata-table"),
-    resolve("node_modules/element-ui/src"),
-    resolve("node_modules/icore-sdk")
+    resolve('src'),
+    resolve('test'),
+    resolve('node_modules/webpack-dev-server/client'),
+    resolve('node_modules/vue-element-bigdata-table'),
+    resolve('node_modules/element-ui/src'),
+    resolve('node_modules/icore-sdk')
   ],
   exclude: [
-    resolve("node_modules/element-ui/src/utils/date.js"),
-    resolve("node_modules/element-ui/src/utils/popper.js")
+    resolve('node_modules/element-ui/src/utils/date.js'),
+    resolve('node_modules/element-ui/src/utils/popper.js')
   ] // sb element-ui竟然在源码里面单独把这两个js转译成了es5 气死哥了！！
-};
+}
 
-if (pathSrc.indexOf("node_modules") > -1) {
+if (pathSrc.indexOf('node_modules') > -1) {
   babelLoader = {
     include: [
-      resolve("src"),
-      resolve("test"),
-      resolve("../../src"),
-      resolve("../../test"),
-      resolve("../webpack-dev-server/client"),
-      resolve("../vue-element-bigdata-table"),
-      resolve("../element-ui/src"),
-      resolve("../icore-sdk")
+      resolve('src'),
+      resolve('test'),
+      resolve('../../src'),
+      resolve('../../test'),
+      resolve('../webpack-dev-server/client'),
+      resolve('../vue-element-bigdata-table'),
+      resolve('../element-ui/src'),
+      resolve('../icore-sdk')
     ],
     exclude: [
-      resolve("../element-ui/src/utils/date.js"),
-      resolve("../element-ui/src/utils/popper.js")
+      resolve('../element-ui/src/utils/date.js'),
+      resolve('../element-ui/src/utils/popper.js')
     ] // sb element-ui竟然在源码里面单独把这两个js转译成了es5 气死哥了！！
-  };
+  }
 }
 
 module.exports = {
-  context: path.resolve(__dirname, "../"),
+  context: path.resolve(__dirname, '../'),
   // entry: {
   //   app: './src/main.js'
   // },
   entry: utils.entries(),
   output: {
     path: config.build.assetsRoot,
-    filename: "[name].js",
+    filename: '[name].js',
     publicPath:
-      process.env.NODE_ENV === "production"
+      process.env.NODE_ENV === 'production'
         ? config.build.assetsPublicPath
         : config.dev.assetsPublicPath
   },
   resolve: {
-    extensions: [".js", ".vue", ".json"],
+    extensions: ['.js', '.vue', '.json'],
     alias: {
-      vue$: "vue/dist/vue.esm.js",
-      "@": resolve("src"),
-      "~": resolve("../../src")
+      vue$: 'vue/dist/vue.esm.js',
+      '@': resolve('src'),
+      '~': resolve('../../src')
     }
   },
   module: {
     rules: [
-      ...(config.dev.useEslint ? [createLintingRule()] : []),
+      ...(config.dev.useEslint ? [] : []), //createLintingRule()
       {
         test: /\.vue$/,
-        loader: "vue-loader",
+        loader: 'vue-loader',
         options: vueLoaderConfig
       },
       {
         test: /\.js$/,
-        loader: "babel-loader",
+        loader: 'babel-loader',
         exclude: babelLoader.exclude,
         include: babelLoader.include
       },
       {
         test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
-        loader: "url-loader",
+        loader: 'url-loader',
         options: {
           limit: 10000,
-          name: utils.assetsPath("img/[name].[hash].[ext]")
+          name: utils.assetsPath('img/[name].[hash].[ext]')
         }
       },
       {
         test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
-        loader: "url-loader",
+        loader: 'url-loader',
         options: {
           limit: 10000,
-          name: utils.assetsPath("media/[name].[hash].[ext]")
+          name: utils.assetsPath('media/[name].[hash].[ext]')
         }
       },
       {
         test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
-        loader: "url-loader",
+        loader: 'url-loader',
         options: {
           limit: 10000,
-          name: utils.assetsPath("fonts/[name].[hash].[ext]")
+          name: utils.assetsPath('fonts/[name].[hash].[ext]')
         }
       }
     ]
@@ -121,10 +121,10 @@ module.exports = {
     setImmediate: false,
     // prevent webpack from injecting mocks to Node native modules
     // that does not make sense for the client
-    dgram: "empty",
-    fs: "empty",
-    net: "empty",
-    tls: "empty",
-    child_process: "empty"
+    dgram: 'empty',
+    fs: 'empty',
+    net: 'empty',
+    tls: 'empty',
+    child_process: 'empty'
   }
-};
+}

config/index.js

@@ -66,7 +66,7 @@ let proxyTable = {
   // 所有数据的请求域名地址
   '/api/v1': {
     target: 'http://172.16.33.166:80',
-    //target: 'http://localhost:8080',
+    // target: 'http://localhost:8080',
     // target: "http://192.168.1.101:8080",
     ws: true,
     pathRewrite: {

package.json

@@ -71,7 +71,8 @@
     "x2js": "^3.3.0",
     "xe-utils": "^3.5.4",
     "xlsx": "^0.18.4",
-    "xterm": "3.12.0"
+    "xterm": "3.12.0",
+    "codemirror": "5.65.5"
   },
   "devDependencies": {
     "@vue/test-utils": "^1.0.0-beta.24",

src/components/DilCommonUI/packages/table/src/table.js

@@ -92,6 +92,7 @@ export default {
               //执行成功的回调
               this.$emit("func", response.data.data);
               this.refreshColumnData(d.columnData);
+              //this.$refs.mainTable.getTableConfig();
               this.isShow = true;
             });
         } else {
@@ -111,6 +112,7 @@ export default {
               //执行成功的回调
               this.$emit("func", response.data.data);
               this.refreshColumnData(d.columnData);
+              //this.$refs.mainTable.getTableConfig();
               this.isShow = true;
             });
         }

src/components/DilCommonUI/packages/table/src/table.vue

@@ -280,12 +280,7 @@ export default {
     //合计
     //表尾合计行
     getSummaries(param) {
-      console.log(param);
       const { columns, data } = param;
-      console.log("columns");
-      console.log(columns);
-      console.log("data");
-      console.log(data);
       const sums = [];
       columns.forEach((column, index) => {
         //如果索引值为0,则展示‘合计’

src/components/main.vue

@@ -2733,7 +2733,7 @@ export default {
   width: 100%;
   //   min-width: 1200px;
   height: calc(100% - 60px);
-  overflow-y: auto;
+  overflow: auto;
   ::-webkit-scrollbar {
     //滚动条宽高，如果不需要显示滚动条可设置宽高为0
     width: 0px;

src/config/axiosPass.js

@@ -7,59 +7,56 @@
  * Created at     : 2018-08-27 10:50:48
  * Last modified  : 2020-01-07 10:18:23
  */
-import Vue from 'vue';
-import querystring from 'querystring';
+import Vue from 'vue'
+import querystring from 'querystring'
 // import store from '@/store/store.js';
-import { ajaxCtx } from '@/config/config.js';
-import {
-  getCookie,
-  setCookie
-} from '@/utils/util.js';
-import store from '@/store/index.js';
-import ElementUI from 'element-ui';
+import { ajaxCtx } from '@/config/config.js'
+import { getCookie, setCookie } from '@/utils/util.js'
+import store from '@/store/index.js'
+import ElementUI from 'element-ui'
 
 // noToken  不用添加token的接口
-export const noToken = ['auth/login'];
+export const noToken = ['auth/login']
 
 //  token
-const hasNoToken = function (config) {
+const hasNoToken = function(config) {
   let arr = noToken.filter(item => {
     if (config.url.indexOf(item) > -1) {
-      return true;
+      return true
     } else {
-      return false;
+      return false
     }
-  });
-  return arr;
+  })
+  return arr
 }
 
 //   前台项目名称、接口项目名称，用于判断请求接口是哪个项目
-export const APIPro = ['pass/', 'multEntry', 'edgeDevice'];
+export const APIPro = ['pass/', 'multEntry', 'edgeDevice']
 
 /**
  * url中是否有项目名称
  * @param {String} url url地址
  * @param {String} APIPro 项目地址目录名称
  */
-export const apiIsPassProject = function (url, APIPro) {
+export const apiIsPassProject = function(url, APIPro) {
   if (Array.isArray(APIPro)) {
     let items = APIPro.filter((val, i) => {
       if (url.indexOf(val) > -1) {
-        return true;
+        return true
       } else {
-        return false;
+        return false
       }
-    });
+    })
     if (items.length > 0) {
-      return true;
+      return true
     } else {
-      return false;
+      return false
     }
   }
   if (url.indexOf(APIPro) > -1) {
-    return true;
+    return true
   } else {
-    return false;
+    return false
   }
 }
 
@@ -68,13 +65,13 @@ export const apiIsPassProject = function (url, APIPro) {
  * @param {Object} config request请求
  * @return {Object} config axios配置文件
  */
-export const requestConfig = function (config) {
+export const requestConfig = function(config) {
   if (!apiIsPassProject(config.url, APIPro)) {
     //  不是平台的接口 ， 原样返回
     if (hasNoToken(config).length < 1) {
       //   config.headers.authorization = 'Bearer ' + getCookie('accessToken');
     }
-    return config;
+    return config
   }
   //  是平台接口
   //
@@ -83,31 +80,43 @@ export const requestConfig = function (config) {
     //  请求类型
     if (config.method === 'get' || config.individualType === 'json') {
       // do
-    } else if (config.method === 'post' && config.headers['Content-Type'] !== 'multipart/form-data') {
-      config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
+    } else if (
+      config.method === 'post' &&
+      config.headers['Content-Type'] !== 'multipart/form-data'
+    ) {
+      config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
     } else if (config.method === 'put') {
-      config.headers['Content-Type'] = 'application/json;charset=UTF-8';
-    } else if (config.method === 'delete' && config.headers['Content-Type'] !== 'multipart/form-data') {
-      config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
+      config.headers['Content-Type'] = 'application/json;charset=UTF-8'
+    } else if (
+      config.method === 'delete' &&
+      config.headers['Content-Type'] !== 'multipart/form-data'
+    ) {
+      config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
     }
     //  请求数据
-    if ((config.method === 'post' && config.individualType !== 'json') || config.method === 'delete') {
+    if (
+      (config.method === 'post' && config.individualType !== 'json') ||
+      config.method === 'delete'
+    ) {
       if (config.headers['Content-Type'] === 'multipart/form-data') {
         //
       } else {
-        config.data = querystring.stringify(config.data);
+        config.data = querystring.stringify(config.data)
       }
     }
   }
   //  token
   if (hasNoToken(config).length < 1) {
-    config.headers.authorization = 'Bearer ' + getCookie('accessToken');
+    console.log('urlx: ', config.url)
+    config.headers.authorization = 'Bearer ' + getCookie('accessToken')
   }
   //  http
-  if (!(config.url.indexOf('http') === 0 || config.url.indexOf('https') === 0)) {
-    config.url = store.getters.API + config.url;
+  if (
+    !(config.url.indexOf('http') === 0 || config.url.indexOf('https') === 0)
+  ) {
+    config.url = store.getters.API + config.url
   }
-  return config;
+  return config
 }
 
 /**
@@ -115,33 +124,33 @@ export const requestConfig = function (config) {
  * @param {Object} response 返回response
  * @return {Object} response
  */
-export const responseConfig = function (response) {
+export const responseConfig = function(response) {
   if (!apiIsPassProject(response.config.url, APIPro)) {
     //  不是平台的接口 ， 原样返回
-    return response;
+    return response
   }
   //  是平台接口整理数据
   //
   //  消息
-  let data = response.data;
+  let data = response.data
   if (data.code === '401') {
     ElementUI.Message({
       message: '登录已过期，请重新登录',
       type: 'error',
-      onClose: function () {
+      onClose: function() {
         //  弹窗关闭时，跳转到登录
-        setCookie('accessToken', '', -1, '/');
-        setCookie('refreshToken', '', -1, '/');
-        setCookie('workDate', '', -1);
-        setCookie('ticket', '', -1, '/');
-        window.top.location.href = store.getters.ctx;
+        setCookie('accessToken', '', -1, '/')
+        setCookie('refreshToken', '', -1, '/')
+        setCookie('workDate', '', -1)
+        setCookie('ticket', '', -1, '/')
+        window.top.location.href = store.getters.ctx
       }
-    });
+    })
   }
   //  数据
-  response = response.data;
-  return response;
+  response = response.data
+  return response
 }
 
 //   适配axios引用
-export const axios = Vue.axios;
+export const axios = Vue.axios

src/config/include.js

@@ -1,5 +1,4 @@
 /* eslint-disable */
-
 /**************************************************************** 通用引入，包含element-ui等 ***********************************************************************************/
 import Vue from 'vue';
 import ElementUI from 'element-ui';
@@ -30,7 +29,6 @@ Vue.use(VueClipboard)
 
 // use element-ui 2.4.2
 Vue.use(ElementUI);
-
 Vue.use(icorePlugin);
 
 /**************************************************************** 引入项目公用样式 简直覆盖Element-ui css ***********************************************************************/

src/config/routerBefore.js

@@ -233,6 +233,7 @@ function DoneCookie(to, from, next, accessToken, flag) {
             }
           }
         } else {
+          /** 
           Message('登录已过期，请重新登录')
           setCookie('accessToken', '', -1, '/')
           setCookie('refreshToken', '', -1, '/')
@@ -241,7 +242,7 @@ function DoneCookie(to, from, next, accessToken, flag) {
           setCookie('ticket', '', -1, '/')
           setTimeout(() => {
             window.top.location.href = store.getters.ctx
-          }, 500)
+          }, 500)*/
         }
       })
       .catch(err => {

src/lib/el-table/index.js

@@ -1,8 +0,0 @@
-import ElTable from './src/table';
-
-/* istanbul ignore next */
-ElTable.install = function(Vue) {
-  Vue.component(ElTable.name, ElTable);
-};
-
-export default ElTable;

src/lib/el-table/src/dropdown.js

@@ -1,28 +0,0 @@
-import Vue from 'vue';
-var dropdowns = [];
-
-!Vue.prototype.$isServer && document.addEventListener('click', function(event) {
-  dropdowns.forEach(function(dropdown) {
-    var target = event.target;
-    if (!dropdown || !dropdown.$el) return;
-    if (target === dropdown.$el || dropdown.$el.contains(target)) {
-      return;
-    }
-    dropdown.handleOutsideClick && dropdown.handleOutsideClick(event);
-  });
-});
-
-export default {
-  open(instance) {
-    if (instance) {
-      dropdowns.push(instance);
-    }
-  },
-
-  close(instance) {
-    var index = dropdowns.indexOf(instance);
-    if (index !== -1) {
-      dropdowns.splice(instance, 1);
-    }
-  }
-};

src/lib/el-table/src/filter-panel.vue

@@ -1,259 +0,0 @@
-<template>
-  <transition name="el-zoom-in-top">
-    <div
-      class="el-table-filter"
-      v-if="multiple"
-      v-clickoutside="handleOutsideClick"
-      v-show="showPopper">
-      <div class="el-table-filter__content">
-        <el-input v-if="column.filters && column.filters.length > 5"
-          placeholder="请输入内容"
-          prefix-icon="el-icon-search"
-          @keyup.native="searchFilterEvent"
-          v-model="searchFilter">
-        </el-input>
-        <el-scrollbar wrap-class="el-table-filter__wrap">
-          <el-checkbox-group class="el-table-filter__checkbox-group" @change="handleCheckedChange" v-model="filteredValue">
-            <el-checkbox :id="'sb' + index"
-              v-for="(filter, index) in filtersBak"
-              :key="filter.value"
-              :label="filter.value">{{ filter.text }}</el-checkbox>
-          </el-checkbox-group>
-        </el-scrollbar>
-      </div>
-      <div class="el-table-filter__bottom">
-        <el-checkbox :indeterminate="isIndeterminate"  v-model="checkAll" @change="checkedAllChange">全选</el-checkbox>
-        <button @click="handleConfirm"
-          :class="{ 'is-disabled': filteredValue.length === 0 }"
-          :disabled="filteredValue.length === 0">{{ t('el.table.confirmFilter') }}</button>
-        <button @click="handleReset">{{ t('el.table.resetFilter') }}</button>
-      </div>
-    </div>
-    <div
-      class="el-table-filter"
-      v-else
-      v-clickoutside="handleOutsideClick"
-      v-show="showPopper">
-      <ul class="el-table-filter__list">
-        <li class="el-table-filter__list-item"
-            :class="{ 'is-active': filterValue === undefined || filterValue === null }"
-            @click="handleSelect(null)">{{ t('el.table.clearFilter') }}</li>
-        <li class="el-table-filter__list-item"
-            v-for="filter in filtersBak"
-            :label="filter.value"
-            :key="filter.value"
-            :class="{ 'is-active': isActive(filter) }"
-            @click="handleSelect(filter.value)" >{{ filter.text }}</li>
-      </ul>
-    </div>
-  </transition>
-</template>
-
-<script type="text/babel">
-  import Popper from 'element-ui/src/utils/vue-popper';
-  import { PopupManager } from 'element-ui/src/utils/popup';
-  import Locale from 'element-ui/src/mixins/locale';
-  import Clickoutside from 'element-ui/src/utils/clickoutside';
-  import Dropdown from './dropdown';
-  import ElCheckbox from 'element-ui/packages/checkbox';
-  import ElCheckboxGroup from 'element-ui/packages/checkbox-group';
-
-  export default {
-    name: 'ElTableFilterPanel',
-
-    mixins: [Popper, Locale],
-
-    directives: {
-      Clickoutside
-    },
-
-    components: {
-      ElCheckbox,
-      ElCheckboxGroup
-    },
-
-    props: {
-      placement: {
-        type: String,
-        default: 'bottom-end'
-      }
-    },
-
-    customRender(h) {
-      return (<div class="el-table-filter">
-        <div class="el-table-filter__content">
-        </div>
-        <div class="el-table-filter__bottom">
-          <button on-click={ this.handleConfirm }>{ this.t('el.table.confirmFilter') }</button>
-          <button on-click={ this.handleReset }>{ this.t('el.table.resetFilter') }</button>
-        </div>
-      </div>);
-    },
-
-    methods: {
-      searchFilterEvent() {
-        let that = this;
-        if (that.searchFilter !== '') {
-          var temp = that.filters.filter(function(val) {
-            return (val.value + '').indexOf(that.searchFilter + '') > -1;
-          });
-          that.filtersBak = temp;
-        } else {
-          that.filtersBak = that.filters;
-        }
-        that.handleCheckedChange(that.filteredValue);
-      },
-      handleCheckedChange(value) {
-        let checkedCount = value.length;
-        this.checkAll = checkedCount === this.filtersBak.length;
-        this.isIndeterminate = checkedCount > 0 && checkedCount < this.filtersBak.length;
-      },
-      checkedAllChange(val) {
-        let that = this;
-        if (val) {
-          var temp = [];
-          for (let i = 0; i < that.filtersBak.length; i++) {
-            temp.push(that.filtersBak[i].value);
-          }
-          temp.unshift('');
-          that.filteredValue = temp;
-        } else {
-          that.filteredValue = [];
-        }
-        that.isIndeterminate = false;
-      },
-      isActive(filter) {
-        return filter.value === this.filterValue;
-      },
-
-      handleOutsideClick() {
-        setTimeout(() => {
-          this.showPopper = false;
-        }, 16);
-      },
-
-      handleConfirm() {
-        this.confirmFilter(this.filteredValue);
-        this.handleOutsideClick();
-        this.searchFilter = '';
-        this.searchFilterEvent();
-      },
-
-      handleReset() {
-        this.filteredValue = [];
-        this.confirmFilter(this.filteredValue);
-        this.handleOutsideClick();
-        this.isIndeterminate = false;
-        this.checkAll = false;  
-        this.searchFilter = '';
-      },
-
-      handleSelect(filterValue) {
-        this.filterValue = filterValue;
-
-        if ((typeof filterValue !== 'undefined') && (filterValue !== null)) {
-          this.confirmFilter(this.filteredValue);
-        } else {
-          this.confirmFilter([]);
-        }
-
-        this.handleOutsideClick();
-      },
-
-      confirmFilter(filteredValue) {
-        this.table.store.commit('filterChange', {
-          column: this.column,
-          values: filteredValue
-        });
-        this.table.store.updateAllSelected();
-      }
-    },
-
-    data() {
-      return {
-        table: null,
-        cell: null,
-        column: null,
-        isIndeterminate: false,
-        checkAll: false,
-        searchFilter: '',
-        filtersBak: []
-      };
-    },
-
-    computed: {
-      filters: {
-        get() {
-					return this.column && this.column.filters;
-        },
-        set() {
-          this.filtersBak = this.column && this.column.filters;
-        }
-      },
-
-      filterValue: {
-        get() {
-          return (this.column.filteredValue || [])[0];
-        },
-        set(value) {
-          if (this.filteredValue) {
-            if ((typeof value !== 'undefined') && (value !== null)) {
-              this.filteredValue.splice(0, 1, value);
-            } else {
-              this.filteredValue.splice(0, 1);
-            }
-          }
-        }
-      },
-
-      filteredValue: {
-        get() {
-          if (this.column) {
-            return this.column.filteredValue || [];
-          }
-          return [];
-        },
-        set(value) {
-          if (this.column) {
-            this.column.filteredValue = value;
-          }
-        }
-      },
-
-      multiple() {
-        if (this.column) {
-          return this.column.filterMultiple;
-        }
-        return true;
-      }
-    },
-
-    mounted() {
-      this.popperElm = this.$el;
-      this.referenceElm = this.cell;  
-      this.table.bodyWrapper.addEventListener('scroll', () => {
-        this.updatePopper();
-      });
-
-      this.$watch('showPopper', (value) => {
-        if (this.column) this.column.filterOpened = value;
-        if (value) {
-          Dropdown.open(this);
-          this.filters = this.column && this.column.filters;
-          let checkedCount = this.filteredValue.length;
-          this.checkAll = checkedCount === this.filtersBak.length;
-          this.isIndeterminate = checkedCount > 0 && checkedCount < this.filtersBak.length;
-        } else {
-          Dropdown.close(this);
-        }
-      });
-    },
-    watch: {
-      showPopper(val) {
-        if (val === true && parseInt(this.popperJS._popper.style.zIndex, 10) < PopupManager.zIndex) {
-          this.popperJS._popper.style.zIndex = PopupManager.nextZIndex();
-        }
-      }
-    }
-  };
-</script>

src/lib/el-table/src/layout-observer.js

@@ -1,68 +0,0 @@
-export default {
-  created() {
-    this.tableLayout.addObserver(this);
-  },
-
-  destroyed() {
-    this.tableLayout.removeObserver(this);
-  },
-
-  computed: {
-    tableLayout() {
-      let layout = this.layout;
-      if (!layout && this.table) {
-        layout = this.table.layout;
-      }
-      if (!layout) {
-        throw new Error('Can not find table layout.');
-      }
-      return layout;
-    }
-  },
-
-  mounted() {
-    this.onColumnsChange(this.tableLayout);
-    this.onScrollableChange(this.tableLayout);
-  },
-
-  updated() {
-    if (this.__updated__) return;
-    this.onColumnsChange(this.tableLayout);
-    this.onScrollableChange(this.tableLayout);
-    this.__updated__ = true;
-  },
-
-  methods: {
-    onColumnsChange() {
-      const cols = this.$el.querySelectorAll('colgroup > col');
-      if (!cols.length) return;
-      const flattenColumns = this.tableLayout.getFlattenColumns();
-      const columnsMap = {};
-      flattenColumns.forEach((column) => {
-        columnsMap[column.id] = column;
-      });
-      for (let i = 0, j = cols.length; i < j; i++) {
-        const col = cols[i];
-        const name = col.getAttribute('name');
-        const column = columnsMap[name];
-        if (column) {
-          col.setAttribute('width', column.realWidth || column.width);
-        }
-      }
-    },
-
-    onScrollableChange(layout) {
-      const cols = this.$el.querySelectorAll('colgroup > col[name=gutter]');
-      for (let i = 0, j = cols.length; i < j; i++) {
-        const col = cols[i];
-        col.setAttribute('width', layout.scrollY ? layout.gutterWidth : '0');
-      }
-      const ths = this.$el.querySelectorAll('th.gutter');
-      for (let i = 0, j = ths.length; i < j; i++) {
-        const th = ths[i];
-        th.style.width = layout.scrollY ? layout.gutterWidth + 'px' : '0';
-        th.style.display = layout.scrollY ? '' : 'none';
-      }
-    }
-  }
-};

src/lib/el-table/src/table-body.js

@@ -1,478 +0,0 @@
-import { getCell, getColumnByCell, getRowIdentity } from './util';
-import { getStyle, hasClass, addClass, removeClass } from 'element-ui/src/utils/dom';
-// import ElCheckbox from 'element-ui/packages/checkbox';
-// import ElTooltip from 'element-ui/packages/tooltip';
-import debounce from 'throttle-debounce/debounce';
-import LayoutObserver from './layout-observer';
-
-export default {
-  name: 'ElTableBody',
-
-  mixins: [LayoutObserver],
-
-  components: {
-    // ElCheckbox,
-    // ElTooltip
-  },
-
-  props: {
-    store: {
-      required: true
-    },
-    stripe: Boolean,
-    context: {},
-    rowClassName: [String, Function],
-    rowStyle: [Object, Function],
-    fixed: String,
-    highlight: Boolean,
-    dragRow:[String,Boolean]
-  },
-
-  render(h) {
-    const columnsHidden = this.columns.map((column, index) => this.isColumnHidden(index));
-    return (
-      <table
-        class="el-table__body"
-        cellspacing="0"
-        cellpadding="0"
-        border="0">
-        <colgroup>
-          {
-            this._l(this.columns, column => <col name={ column.id } />)
-          }
-        </colgroup>
-        <tbody>
-          {
-            this._l(this.data, (row, $index) =>
-              [<tr
-                draggable = {this.dragRow ? true : false}
-                on-drop={ ($event) => this.dropRowSet($event,$index)}
-                on-dragstart={ ($event) => this.dropRowStart($event,$index) }
-                on-dragover={ ($event) => this.dropRowOver($event) }
-                style={ this.rowStyle ? this.getRowStyle(row, $index) : null }
-                key={ this.table.rowKey ? this.getKeyOfRow(row, $index) : $index }
-                on-dblclick={ ($event) => this.handleDoubleClick($event, row) }
-                on-click={ ($event) => this.handleClick($event, row) }
-                on-contextmenu={ ($event) => this.handleContextMenu($event, row) }
-                on-mouseenter={ _ => this.handleMouseEnter($index) }
-                on-mouseleave={ _ => this.handleMouseLeave() }
-                class={ [this.getRowClass(row, $index)] }>
-                {
-                  this._l(this.columns, (column, cellIndex) => {
-                    const { rowspan, colspan } = this.getSpan(row, column, $index, cellIndex);
-                    if (!rowspan || !colspan) {
-                      return '';
-                    } else {
-                      if (rowspan === 1 && colspan === 1) {
-                        return (
-                          <td
-                            style={ this.getCellStyle($index, cellIndex, row, column) }
-                            class={ this.getCellClass($index, cellIndex, row, column) }
-                            on-mouseenter={ ($event) => this.handleCellMouseEnter($event, row) }
-                            on-mouseleave={ this.handleCellMouseLeave }>
-                            {
-                              column.renderCell.call(
-                                this._renderProxy,
-                                h,
-                                {
-                                  row,
-                                  column,
-                                  $index,
-                                  store: this.store,
-                                  _self: this.context || this.table.$vnode.context
-                                },
-                                columnsHidden[cellIndex]
-                              )
-                            }
-                          </td>
-                        );
-                      } else {
-                        return (
-                          <td
-                            style={ this.getCellStyle($index, cellIndex, row, column) }
-                            class={ this.getCellClass($index, cellIndex, row, column) }
-                            rowspan={ rowspan }
-                            colspan={ colspan }
-                            on-mouseenter={ ($event) => this.handleCellMouseEnter($event, row) }
-                            on-mouseleave={ this.handleCellMouseLeave }>
-                            {
-                              column.renderCell.call(
-                                this._renderProxy,
-                                h,
-                                {
-                                  row,
-                                  column,
-                                  $index,
-                                  store: this.store,
-                                  _self: this.context || this.table.$vnode.context
-                                },
-                                columnsHidden[cellIndex]
-                              )
-                            }
-                          </td>
-                        );
-                      }
-                    }
-                  })
-                }
-              </tr>,
-              this.store.isRowExpanded(row)
-                ? (<tr>
-                  <td colspan={ this.columns.length } class="el-table__expanded-cell">
-                    { this.table.renderExpanded ? this.table.renderExpanded(h, { row, $index, store: this.store }) : ''}
-                  </td>
-                </tr>)
-                : ''
-              ]
-            ).concat(
-              <el-tooltip effect={ this.table.tooltipEffect } placement="top" ref="tooltip" content={ this.tooltipContent }></el-tooltip>
-            )
-          }
-        </tbody>
-      </table>
-    );
-  },
-
-  watch: {
-    'store.states.hoverRow'(newVal, oldVal) {
-      if (!this.store.states.isComplex) return;
-      const el = this.$el;
-      if (!el) return;
-      const tr = el.querySelector('tbody').children;
-      const rows = [].filter.call(tr, row => hasClass(row, 'el-table__row'));
-      const oldRow = rows[oldVal];
-      const newRow = rows[newVal];
-      if (oldRow) {
-        removeClass(oldRow, 'hover-row');
-      }
-      if (newRow) {
-        addClass(newRow, 'hover-row');
-      }
-    },
-    'store.states.currentRow'(newVal, oldVal) {
-      if (!this.highlight) return;
-      const el = this.$el;
-      if (!el) return;
-      const data = this.store.states.data;
-      const tr = el.querySelector('tbody').children;
-      const rows = [].filter.call(tr, row => hasClass(row, 'el-table__row'));
-      const oldRow = rows[data.indexOf(oldVal)];
-      const newRow = rows[data.indexOf(newVal)];
-      if (oldRow) {
-        removeClass(oldRow, 'current-row');
-      } else {
-        [].forEach.call(rows, row => removeClass(row, 'current-row'));
-      }
-      if (newRow) {
-        addClass(newRow, 'current-row');
-      }
-    }
-  },
-
-  computed: {
-    table() {
-      return this.$parent;
-    },
-
-    data() {
-      return this.store.states.data;
-    },
-
-    columnsCount() {
-      return this.store.states.columns.length;
-    },
-
-    leftFixedLeafCount() {
-      return this.store.states.fixedLeafColumnsLength;
-    },
-
-    rightFixedLeafCount() {
-      return this.store.states.rightFixedLeafColumnsLength;
-    },
-
-    leftFixedCount() {
-      return this.store.states.fixedColumns.length;
-    },
-
-    rightFixedCount() {
-      return this.store.states.rightFixedColumns.length;
-    },
-
-    columns() {
-      return this.store.states.columns;
-    }
-  },
-
-  data() {
-    return {
-      tooltipContent: '',
-    };
-  },
-
-  created() {
-    this.activateTooltip = debounce(50, tooltip => tooltip.handleShowPopper());
-  },
-
-  methods: {
-    getKeyOfRow(row, index) {
-      const rowKey = this.table.rowKey;
-      if (rowKey) {
-        return getRowIdentity(row, rowKey);
-      }
-      return index;
-    },
-
-    isColumnHidden(index) {
-      if (this.fixed === true || this.fixed === 'left') {
-        return index >= this.leftFixedLeafCount;
-      } else if (this.fixed === 'right') {
-        return index < this.columnsCount - this.rightFixedLeafCount;
-      } else {
-        return (index < this.leftFixedLeafCount) || (index >= this.columnsCount - this.rightFixedLeafCount);
-      }
-    },
-
-    getSpan(row, column, rowIndex, columnIndex) {
-      let rowspan = 1;
-      let colspan = 1;
-
-      const fn = this.table.spanMethod;
-      if (typeof fn === 'function') {
-        const result = fn({
-          row,
-          column,
-          rowIndex,
-          columnIndex
-        });
-
-        if (Array.isArray(result)) {
-          rowspan = result[0];
-          colspan = result[1];
-        } else if (typeof result === 'object') {
-          rowspan = result.rowspan;
-          colspan = result.colspan;
-        }
-      }
-
-      return {
-        rowspan,
-        colspan
-      };
-    },
-
-    getRowStyle(row, rowIndex) {
-      const rowStyle = this.table.rowStyle;
-      if (typeof rowStyle === 'function') {
-        return rowStyle.call(null, {
-          row,
-          rowIndex
-        });
-      }
-      return rowStyle;
-    },
-
-    getRowClass(row, rowIndex) {
-      const currentRow = this.store.states.currentRow;
-      const classes = this.table.highlightCurrentRow && currentRow === row
-        ? ['el-table__row', 'current-row']
-        : ['el-table__row'];
-
-      if (this.stripe && rowIndex % 2 === 1) {
-        classes.push('el-table__row--striped');
-      }
-      const rowClassName = this.table.rowClassName;
-      if (typeof rowClassName === 'string') {
-        classes.push(rowClassName);
-      } else if (typeof rowClassName === 'function') {
-        classes.push(rowClassName.call(null, {
-          row,
-          rowIndex
-        }));
-      }
-
-      if (this.store.states.expandRows.indexOf(row) > -1) {
-        classes.push('expanded');
-      }
-
-      return classes.join(' ');
-    },
-
-    getCellStyle(rowIndex, columnIndex, row, column) {
-      const cellStyle = this.table.cellStyle;
-      if (typeof cellStyle === 'function') {
-        return cellStyle.call(null, {
-          rowIndex,
-          columnIndex,
-          row,
-          column
-        });
-      }
-      return cellStyle;
-    },
-
-    getCellClass(rowIndex, columnIndex, row, column) {
-      const classes = [column.id, column.align, column.className];
-
-      if (this.isColumnHidden(columnIndex)) {
-        classes.push('is-hidden');
-      }
-      
-      if (column.whiteSpaceNowrap) {
-        let _div = document.createElement('div');
-        _div.style.position = 'absolute';
-        _div.style.opacity = '0';
-        _div.style['white-space'] = 'nowrap';
-        _div.innerHTML = row[column.property] ? row[column.property] : '';
-        $('body').append(_div)
-        var realWIdth = _div.scrollWidth;
-        $(_div).remove();
-        
-        if (column.realWidth != null && column.realWidth > realWIdth || column.width > realWIdth || column.minWidth > realWIdth) {
-          //TODO
-        } else {
-          column.width = column.realWidth = realWIdth + 50;
-        }
-      }
-      
-
-      const cellClassName = this.table.cellClassName;
-      if (typeof cellClassName === 'string') {
-        classes.push(cellClassName);
-      } else if (typeof cellClassName === 'function') {
-        classes.push(cellClassName.call(null, {
-          rowIndex,
-          columnIndex,
-          row,
-          column
-        }));
-      }
-
-      return classes.join(' ');
-    },
-
-    handleCellMouseEnter(event, row) {
-      const table = this.table;
-      const cell = getCell(event);
-
-      if (cell) {
-        const column = getColumnByCell(table, cell);
-        const hoverState = table.hoverState = {cell, column, row};
-        table.$emit('cell-mouse-enter', hoverState.row, hoverState.column, hoverState.cell, event);
-      }
-
-      // 判断是否text-overflow, 如果是就显示tooltip
-      const cellChild = event.target.querySelector('.cell');
-      if (!hasClass(cellChild, 'el-tooltip')) {
-        return;
-      }
-      // use range width instead of scrollWidth to determine whether the text is overflowing
-      // to address a potential FireFox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1074543#c3
-      const range = document.createRange();
-      range.setStart(cellChild, 0);
-      range.setEnd(cellChild, cellChild.childNodes.length);
-      const rangeWidth = range.getBoundingClientRect().width;
-      const padding = (parseInt(getStyle(cellChild, 'paddingLeft'), 10) || 0) +
-        (parseInt(getStyle(cellChild, 'paddingRight'), 10) || 0);
-      if ((rangeWidth + padding > cellChild.offsetWidth || cellChild.scrollWidth > cellChild.offsetWidth) 
-            && (this.$refs.tooltip && $(cellChild).find('input').length <= 0 ||  $(cellChild).find('input').css('display') == 'none')) {
-        const tooltip = this.$refs.tooltip;
-        // TODO 会引起整个 Table 的重新渲染，需要优化
-        this.tooltipContent = cell.textContent || cell.innerText;
-        tooltip.referenceElm = cell;
-        tooltip.$refs.popper && (tooltip.$refs.popper.style.display = 'none');
-        tooltip.doDestroy();
-        tooltip.setExpectedState(true);
-        this.activateTooltip(tooltip);
-      }
-    },
-
-    handleCellMouseLeave(event) {
-      const tooltip = this.$refs.tooltip;
-      if (tooltip) {
-        tooltip.setExpectedState(false);
-        tooltip.handleClosePopper();
-      }
-      const cell = getCell(event);
-      if (!cell) return;
-
-      const oldHoverState = this.table.hoverState || {};
-      this.table.$emit('cell-mouse-leave', oldHoverState.row, oldHoverState.column, oldHoverState.cell, event);
-    },
-
-    handleMouseEnter(index) {
-      this.store.commit('setHoverRow', index);
-    },
-
-    handleMouseLeave() {
-      this.store.commit('setHoverRow', null);
-    },
-
-    handleContextMenu(event, row) {
-      this.handleEvent(event, row, 'contextmenu');
-    },
-
-    handleDoubleClick(event, row) {
-      let eventParent = event.target.parentNode.parentNode;
-      //取消拖拽
-      this.handleEvent(event, row, 'dblclick');
-      $(eventParent).attr('draggable',false)
-    },
-
-    handleClick(event, row) {
-        this.store.commit('setCurrentRow', row);
-        this.handleEvent(event, row, 'click');      
-        let eventParent = event.target.parentNode.parentNode;
-        let allTr = $(eventParent).siblings();
-        //恢复拖拽
-        if(this.dragRow){
-          if ($(eventParent).attr('draggable')){
-            for (let i = 0; i<allTr.length; i++){
-              $(allTr[i]).attr('draggable',true);
-            }
-          } 
-        }             
-    },
-
-    handleEvent(event, row, name) {
-      const table = this.table;
-      const cell = getCell(event);
-      let column;
-      if (cell) {
-        column = getColumnByCell(table, cell);
-        if (column) {
-          table.$emit(`cell-${name}`, row, column, cell, event);
-        }
-      }
-      table.$emit(`row-${name}`, row, event, column);
-    },
-
-    handleExpandClick(row, e) {
-      e.stopPropagation();
-      this.store.toggleRowExpansion(row);
-    },
-
-    //拖动行
-    dropRowSet(event,index) {
-      let that =this;
-      if (!that.dragRow){
-        return;
-      }
-      that.dragEnd = index;
-      if (that.dragRow && that.dragStart != that.dragEnd){
-        that.store.changeRowOrder(that.dragStart, that.dragEnd);
-      }
-    },
-    dropRowStart(event,index) {
-      if (!this.dragRow){
-        return;
-      }
-      this.dragStart = index;
-    },
-    dropRowOver(event,index) {
-      if (!this.dragRow){
-        return;
-      }
-      event.preventDefault();
-    }
-  }
-};

src/lib/el-table/src/table-column.js

@@ -1,438 +0,0 @@
-import ElCheckbox from 'element-ui/packages/checkbox';
-import ElTag from 'element-ui/packages/tag';
-import objectAssign from 'element-ui/src/utils/merge';
-import { getPropByPath } from 'element-ui/src/utils/util';
-
-let columnIdSeed = 1;
-
-const defaults = {
-  default: {
-    order: ''
-  },
-  selection: {
-    width: 48,
-    minWidth: 48,
-    realWidth: 48,
-    order: '',
-    className: 'el-table-column--selection'
-  },
-  expand: {
-    width: 48,
-    minWidth: 48,
-    realWidth: 48,
-    order: ''
-  },
-  index: {
-    width: 48,
-    minWidth: 48,
-    realWidth: 48,
-    order: ''
-  }
-};
-
-const forced = {
-  selection: {
-    renderHeader: function(h, { store }) {
-      return <el-checkbox
-        disabled={ store.states.data && store.states.data.length === 0 }
-        indeterminate={ store.states.selection.length > 0 && !this.isAllSelected }
-        nativeOn-click={ this.toggleAllSelection }
-        value={ this.isAllSelected } />;
-    },
-    renderCell: function(h, { row, column, store, $index }) {
-      return <el-checkbox
-        nativeOn-click={ (event) => event.stopPropagation() }
-        value={ store.isSelected(row) }
-        disabled={ column.selectable ? !column.selectable.call(null, row, $index) : false }
-        on-input={ () => { store.commit('rowSelectedChanged', row); } } />;
-    },
-    sortable: false,
-    resizable: false
-  },
-  index: {
-    renderHeader: function(h, { column }) {
-      return column.label || '#';
-    },
-    renderCell: function(h, { $index, column }) {
-      let i = $index + 1;
-      const index = column.index;
-
-      if (typeof index === 'number') {
-        i = $index + index;
-      } else if (typeof index === 'function') {
-        i = index($index);
-      }
-
-      return <div>{ i }</div>;
-    },
-    sortable: false
-  },
-  expand: {
-    renderHeader: function(h, { column }) {
-      return column.label || '';
-    },
-    renderCell: function(h, { row, store }, proxy) {
-      const expanded = store.states.expandRows.indexOf(row) > -1;
-      return <div class={ 'el-table__expand-icon ' + (expanded ? 'el-table__expand-icon--expanded' : '') }
-        on-click={ e => proxy.handleExpandClick(row, e) }>
-        <i class='el-icon el-icon-arrow-right'></i>
-      </div>;
-    },
-    sortable: false,
-    resizable: false,
-    className: 'el-table__expand-column'
-  }
-};
-
-const getDefaultColumn = function(type, options) {
-  const column = {};
-
-  objectAssign(column, defaults[type || 'default']);
-
-  for (let name in options) {
-    if (options.hasOwnProperty(name)) {
-      const value = options[name];
-      if (typeof value !== 'undefined') {
-        column[name] = value;
-      }
-    }
-  }
-
-  if (!column.minWidth) {
-    column.minWidth = 80;
-  }
-
-  column.realWidth = column.width === undefined ? column.minWidth : column.width;
-
-  return column;
-};
-
-const DEFAULT_RENDER_CELL = function(h, { row, column, $index }) {
-  const property = column.property;
-  const value = property && getPropByPath(row, property).v;
-  if (column && column.formatter) {
-    return column.formatter(row, column, value, $index);
-  }
-  return value;
-};
-
-const parseWidth = (width) => {
-  if (width !== undefined) {
-    width = parseInt(width, 10);
-    if (isNaN(width)) {
-      width = null;
-    }
-  }
-  return width;
-};
-
-const parseMinWidth = (minWidth) => {
-  if (minWidth !== undefined) {
-    minWidth = parseInt(minWidth, 10);
-    if (isNaN(minWidth)) {
-      minWidth = 80;
-    }
-  }
-  return minWidth;
-};
-
-export default {
-  name: 'ElTableColumn',
-
-  props: {
-    type: {
-      type: String,
-      default: 'default'
-    },
-    label: String,
-    className: String,
-    labelClassName: String,
-    property: String,
-    prop: String,
-    width: {},
-    minWidth: {},
-    renderHeader: Function,
-    sortable: {
-      type: [String, Boolean],
-      default: false
-    },
-    sortMethod: Function,
-    sortBy: [String, Function, Array],
-    resizable: {
-      type: Boolean,
-      default: true
-    },
-    context: {},
-    columnKey: String,
-    align: String,
-    headerAlign: String,
-    showTooltipWhenOverflow: Boolean,
-    showOverflowTooltip: Boolean,
-    whiteSpaceNowrap: Boolean,
-    fixed: [Boolean, String],
-    formatter: Function,
-    selectable: Function,
-    reserveSelection: Boolean,
-    filterMethod: Function,
-    filteredValue: Array,
-    filters: Array,
-    filterPlacement: String,
-    filterMultiple: {
-      type: Boolean,
-      default: true
-    },
-    index: [Number, Function],
-    sortOrders: {
-      type: Array,
-      default() {
-        return ['ascending', 'descending', null];
-      },
-      validator(val) {
-        return val.every(order => ['ascending', 'descending', null].indexOf(order) > -1);
-      }
-    }
-  },
-
-  data() {
-    return {
-      isSubColumn: false,
-      columns: []
-    };
-  },
-
-  beforeCreate() {
-    this.row = {};
-    this.column = {};
-    this.$index = 0;
-  },
-
-  components: {
-    ElCheckbox,
-    ElTag
-  },
-
-  computed: {
-    owner() {
-      let parent = this.$parent;
-      while (parent && !parent.tableId) {
-        parent = parent.$parent;
-      }
-      return parent;
-    },
-    columnOrTableParent() {
-      let parent = this.$parent;
-      while (parent && !parent.tableId && !parent.columnId) {
-        parent = parent.$parent;
-      }
-      return parent;
-    }
-  },
-
-  created() {
-    this.customRender = this.$options.render;
-    this.$options.render = h => h('div', this.$slots.default);
-
-    let parent = this.columnOrTableParent;
-    let owner = this.owner;
-    this.isSubColumn = owner !== parent;
-    this.columnId = (parent.tableId || parent.columnId) + '_column_' + columnIdSeed++;
-
-    let type = this.type;
-
-    const width = parseWidth(this.width);
-    const minWidth = parseMinWidth(this.minWidth);
-
-    let isColumnGroup = false;
-
-    let column = getDefaultColumn(type, {
-      id: this.columnId,
-      columnKey: this.columnKey,
-      label: this.label,
-      className: this.className,
-      labelClassName: this.labelClassName,
-      property: this.prop || this.property,
-      type,
-      renderCell: null,
-      renderHeader: this.renderHeader,
-      minWidth,
-      width,
-      isColumnGroup,
-      context: this.context,
-      align: this.align ? 'is-' + this.align : null,
-      headerAlign: this.headerAlign ? 'is-' + this.headerAlign : (this.align ? 'is-' + this.align : null),
-      sortable: this.sortable === '' ? true : this.sortable,
-      sortMethod: this.sortMethod,
-      sortBy: this.sortBy,
-      resizable: this.resizable,
-      showOverflowTooltip: this.showOverflowTooltip || this.showTooltipWhenOverflow,
-      whiteSpaceNowrap: this.whiteSpaceNowrap,
-      formatter: this.formatter,
-      selectable: this.selectable,
-      reserveSelection: this.reserveSelection,
-      fixed: this.fixed === '' ? true : this.fixed,
-      filterMethod: this.filterMethod,
-      filters: this.filters,
-      filterable: this.filters || this.filterMethod,
-      filterMultiple: this.filterMultiple,
-      filterOpened: false,
-      filteredValue: this.filteredValue || [],
-      filterPlacement: this.filterPlacement || '',
-      index: this.index,
-      sortOrders: this.sortOrders
-    });
-
-    objectAssign(column, forced[type] || {});
-
-    this.columnConfig = column;
-
-    let renderCell = column.renderCell;
-    let _self = this;
-
-    if (type === 'expand') {
-      owner.renderExpanded = function(h, data) {
-        return _self.$scopedSlots.default
-          ? _self.$scopedSlots.default(data)
-          : _self.$slots.default;
-      };
-
-      column.renderCell = function(h, data) {
-        return <div class="cell">{ renderCell(h, data, this._renderProxy) }</div>;
-      };
-
-      return;
-    }
-
-    column.renderCell = function(h, data) {
-      if (_self.$scopedSlots.default) {
-        renderCell = () => _self.$scopedSlots.default(data);
-      }
-
-      if (!renderCell) {
-        renderCell = DEFAULT_RENDER_CELL;
-      }
-
-      return _self.showOverflowTooltip || _self.showTooltipWhenOverflow
-        ? <div class="cell el-tooltip" style={ {width: (data.column.realWidth || data.column.width) - 1 + 'px'} }>{ renderCell(h, data) }</div>
-        : <div class="cell">{ renderCell(h, data) }</div>;
-    };
-  },
-
-  destroyed() {
-    if (!this.$parent) return;
-    const parent = this.$parent;
-    this.owner.store.commit('removeColumn', this.columnConfig, this.isSubColumn ? parent.columnConfig : null);
-  },
-
-  watch: {
-    label(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.label = newVal;
-      }
-    },
-
-    prop(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.property = newVal;
-      }
-    },
-
-    property(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.property = newVal;
-      }
-    },
-
-    filters(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.filters = newVal;
-      }
-    },
-
-    filterMultiple(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.filterMultiple = newVal;
-      }
-    },
-
-    align(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.align = newVal ? 'is-' + newVal : null;
-
-        if (!this.headerAlign) {
-          this.columnConfig.headerAlign = newVal ? 'is-' + newVal : null;
-        }
-      }
-    },
-
-    headerAlign(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.headerAlign = 'is-' + (newVal ? newVal : this.align);
-      }
-    },
-
-    width(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.width = parseWidth(newVal);
-        this.owner.store.scheduleLayout();
-      }
-    },
-
-    minWidth(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.minWidth = parseMinWidth(newVal);
-        this.owner.store.scheduleLayout();
-      }
-    },
-
-    fixed(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.fixed = newVal;
-        this.owner.store.scheduleLayout(true);
-      }
-    },
-
-    sortable(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.sortable = newVal;
-      }
-    },
-
-    index(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.index = newVal;
-      }
-    },
-
-    formatter(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.formatter = newVal;
-      }
-    },
-
-    className(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.className = newVal;
-      }
-    },
-
-    labelClassName(newVal) {
-      if (this.columnConfig) {
-        this.columnConfig.labelClassName = newVal;
-      }
-    }
-  },
-
-  mounted() {
-    const owner = this.owner;
-    const parent = this.columnOrTableParent;
-    let columnIndex;
-
-    if (!this.isSubColumn) {
-      columnIndex = [].indexOf.call(parent.$refs.hiddenColumns.children, this.$el);
-    } else {
-      columnIndex = [].indexOf.call(parent.$el.children, this.$el);
-    }
-
-    owner.store.commit('insertColumn', this.columnConfig, columnIndex, this.isSubColumn ? parent.columnConfig : null);
-  }
-};

src/lib/el-table/src/table-footer.js

@@ -1,147 +0,0 @@
-import LayoutObserver from './layout-observer';
-
-export default {
-  name: 'ElTableFooter',
-
-  mixins: [LayoutObserver],
-
-  render(h) {
-    let sums = [];
-    if (this.summaryMethod) {
-      sums = this.summaryMethod({ columns: this.columns, data: this.store.states.data });
-    } else {
-      this.columns.forEach((column, index) => {
-        if (index === 0) {
-          sums[index] = this.sumText;
-          return;
-        }
-        const values = this.store.states.data.map(item => Number(item[column.property]));
-        const precisions = [];
-        let notNumber = true;
-        values.forEach(value => {
-          if (!isNaN(value)) {
-            notNumber = false;
-            let decimal = ('' + value).split('.')[1];
-            precisions.push(decimal ? decimal.length : 0);
-          }
-        });
-        const precision = Math.max.apply(null, precisions);
-        if (!notNumber) {
-          sums[index] = values.reduce((prev, curr) => {
-            const value = Number(curr);
-            if (!isNaN(value)) {
-              return parseFloat((prev + curr).toFixed(Math.min(precision, 20)));
-            } else {
-              return prev;
-            }
-          }, 0);
-        } else {
-          sums[index] = '';
-        }
-      });
-    }
-
-    return (
-      <table
-        class="el-table__footer"
-        cellspacing="0"
-        cellpadding="0"
-        border="0">
-        <colgroup>
-          {
-            this._l(this.columns, column => <col name={ column.id } />)
-          }
-          {
-            this.hasGutter ? <col name="gutter" /> : ''
-          }
-        </colgroup>
-        <tbody class={ [{ 'has-gutter': this.hasGutter }] }>
-          <tr>
-            {
-              this._l(this.columns, (column, cellIndex) =>
-                <td
-                  colspan={ column.colSpan }
-                  rowspan={ column.rowSpan }
-                  class={ [column.id, column.headerAlign, column.className || '', this.isCellHidden(cellIndex, this.columns) ? 'is-hidden' : '', !column.children ? 'is-leaf' : '', column.labelClassName] }>
-                  <div class={ ['cell', column.labelClassName] }>
-                    {
-                      sums[cellIndex]
-                    }
-                  </div>
-                </td>
-              )
-            }
-            {
-              this.hasGutter ? <th class="gutter"></th> : ''
-            }
-          </tr>
-        </tbody>
-      </table>
-    );
-  },
-
-  props: {
-    fixed: String,
-    store: {
-      required: true
-    },
-    summaryMethod: Function,
-    sumText: String,
-    border: Boolean,
-    defaultSort: {
-      type: Object,
-      default() {
-        return {
-          prop: '',
-          order: ''
-        };
-      }
-    }
-  },
-
-  computed: {
-    table() {
-      return this.$parent;
-    },
-
-    isAllSelected() {
-      return this.store.states.isAllSelected;
-    },
-
-    columnsCount() {
-      return this.store.states.columns.length;
-    },
-
-    leftFixedCount() {
-      return this.store.states.fixedColumns.length;
-    },
-
-    rightFixedCount() {
-      return this.store.states.rightFixedColumns.length;
-    },
-
-    columns() {
-      return this.store.states.columns;
-    },
-
-    hasGutter() {
-      return !this.fixed && this.tableLayout.gutterWidth;
-    }
-  },
-
-  methods: {
-    isCellHidden(index, columns) {
-      if (this.fixed === true || this.fixed === 'left') {
-        return index >= this.leftFixedCount;
-      } else if (this.fixed === 'right') {
-        let before = 0;
-        for (let i = 0; i < index; i++) {
-          before += columns[i].colSpan;
-        }
-        return before < this.columnsCount - this.rightFixedCount;
-      } else {
-        return (index < this.leftFixedCount) || (index >= this.columnsCount - this.rightFixedCount);
-      }
-    }
-  }
-};

src/lib/el-table/src/table-header.js

@@ -1,656 +0,0 @@
-import { hasClass, addClass, removeClass } from 'element-ui/src/utils/dom';
-import ElCheckbox from 'element-ui/packages/checkbox';
-import ElTag from 'element-ui/packages/tag';
-import Vue from 'vue';
-import FilterPanel from './filter-panel.vue';
-import LayoutObserver from './layout-observer';
-import { setCookie, getCookie } from '@/utils/util.js';
-
-const getAllColumns = (columns) => {
-  const result = [];
-  columns.forEach((column) => {
-    if (column.children) {
-      result.push(column);
-      result.push.apply(result, getAllColumns(column.children));
-    } else {
-      result.push(column);
-    }
-  });
-  return result;
-};
-
-const convertToRows = (originColumns) => {
-  let maxLevel = 1;
-  const traverse = (column, parent) => {
-    if (parent) {
-      column.level = parent.level + 1;
-      if (maxLevel < column.level) {
-        maxLevel = column.level;
-      }
-    }
-    if (column.children) {
-      let colSpan = 0;
-      column.children.forEach((subColumn) => {
-        traverse(subColumn, column);
-        colSpan += subColumn.colSpan;
-      });
-      column.colSpan = colSpan;
-    } else {
-      column.colSpan = 1;
-    }
-  };
-
-  originColumns.forEach((column) => {
-    column.level = 1;
-    traverse(column);
-  });
-
-  const rows = [];
-  for (let i = 0; i < maxLevel; i++) {
-    rows.push([]);
-  }
-
-  const allColumns = getAllColumns(originColumns);
-
-  allColumns.forEach((column) => {
-    if (!column.children) {
-      column.rowSpan = maxLevel - column.level + 1;
-    } else {
-      column.rowSpan = 1;
-    }
-    rows[column.level - 1].push(column);
-  });
-
-  return rows;
-};
-
-export default {
-  name: 'ElTableHeader',
-
-  mixins: [LayoutObserver],
-
-  render(h) {
-    const originColumns = this.store.states.originColumns;
-    const columnRows = convertToRows(originColumns, this.columns);
-    // 是否拥有多级表头
-    const isGroup = columnRows.length > 1;
-    if (isGroup) this.$parent.isGroup = true;
-    return (
-      <table
-        class="el-table__header"
-        cellspacing="0"
-        cellpadding="0"
-        border="0">
-        <colgroup>
-          {
-            this._l(this.columns, column => <col name={ column.id } />)
-          }
-          {
-            this.hasGutter ? <col name="gutter" /> : ''
-          }
-        </colgroup>
-        <thead class={ [{ 'is-group': isGroup, 'has-gutter': this.hasGutter }] }>
-          {
-            this._l(columnRows, (columns, rowIndex) =>
-              <tr
-                style={ this.getHeaderRowStyle(rowIndex) }
-                class={ this.getHeaderRowClass(rowIndex) }
-              >
-                {
-                  this._l(columns, (column, cellIndex) =>
-                    <th
-                      draggable={!column.fixed && this.dragColumn && column.level === 1}
-                      colspan={ column.colSpan }
-                      rowspan={ column.rowSpan }
-                      on-drop={ ($event) => this.dropColumnSet($event, column )}
-                      on-dragstart={ ($event) => this.dropColumnStart($event, column) }
-                      on-dragover={ ($event) => this.dropColumnOver($event, column) }
-                      on-mousemove={ ($event) => this.handleMouseMove($event, column) }
-                      on-mouseout={ this.handleMouseOut }
-                      on-mousedown={ ($event) => this.handleMouseDown($event, column) }
-                      on-click={ ($event) => this.handleHeaderClick($event, column) }
-                      on-contextmenu={ ($event) => this.handleHeaderContextMenu($event, column) }
-                      style={ this.getHeaderCellStyle(rowIndex, cellIndex, columns, column) }
-                      class={ this.getHeaderCellClass(rowIndex, cellIndex, columns, column) }>
-                      <div class={ ['cell', column.filteredValue && column.filteredValue.length > 0 ? 'highlight' : '', column.labelClassName] }>
-                        {
-                          column.renderHeader
-                            ? column.renderHeader.call(this._renderProxy, h, { column, $index: cellIndex, store: this.store, _self: this.$parent.$vnode.context })
-                            : column.label
-                        }
-                        {
-                          column.sortable
-                            ? <span class="caret-wrapper" on-click={ ($event) => this.handleSortClick($event, column) }>
-                              <i class="sort-caret ascending" on-click={ ($event) => this.handleSortClick($event, column, 'ascending') }>
-                              </i>
-                              <i class="sort-caret descending" on-click={ ($event) => this.handleSortClick($event, column, 'descending') }>
-                              </i>
-                            </span>
-                            : ''
-                        }
-                        {
-                          column.filterable
-                            ? <span class="el-table__column-filter-trigger" on-click={ ($event) => this.handleFilterClick($event, column) }><i class={ ['el-icon-arrow-down', column.filterOpened ? 'el-icon-arrow-up' : ''] }></i></span>
-                            : ''
-                        }
-                      </div>
-                      {!column.fixed && this.dragColumn && column.level === 1 ? 
-                        <div style={"position:absolute;width:1px;height:" + this.$parent.bodyHeight.height}></div> : ''}
-                    </th>
-                  )
-                }
-                {
-                  this.hasGutter ? <th class="gutter"></th> : ''
-                }
-              </tr>
-            )
-          }
-        </thead>
-      </table>
-    );
-  },
-
-  props: {
-    fixed: String,
-    store: {
-      required: true
-    },
-    border: Boolean,
-    dragColumn: [String, Boolean],    
-    defaultSort: {
-      type: Object,
-      default() {
-        return {
-          prop: '',
-          order: ''
-        };
-      }
-    }
-  },
-
-  components: {
-    ElCheckbox,
-    ElTag
-  },
-
-  computed: {
-    table() {
-      return this.$parent;
-    },
-
-    isAllSelected() {
-      return this.store.states.isAllSelected;
-    },
-
-    columnsCount() {
-      return this.store.states.columns.length;
-    },
-
-    leftFixedCount() {
-      return this.store.states.fixedColumns.length;
-    },
-
-    rightFixedCount() {
-      return this.store.states.rightFixedColumns.length;
-    },
-
-    leftFixedLeafCount() {
-      return this.store.states.fixedLeafColumnsLength;
-    },
-
-    rightFixedLeafCount() {
-      return this.store.states.rightFixedLeafColumnsLength;
-    },
-
-    columns() {
-      return this.store.states.columns;
-    },
-
-    hasGutter() {
-      return !this.fixed && this.tableLayout.gutterWidth;
-    }
-  },
-
-  created() {
-    this.filterPanels = {};
-  },
-
-  mounted() {
-    const { prop, order } = this.defaultSort;
-    this.store.commit('sort', { prop, order });
-    this.setCookieColumn();
-  },
-
-  beforeDestroy() {
-    const panels = this.filterPanels;
-    for (let prop in panels) {
-      if (panels.hasOwnProperty(prop) && panels[prop]) {
-        panels[prop].$destroy(true);
-      }
-    }
-  },
-
-  methods: {
-    setCookieColumn() {
-      let that = this;
-      var columnOrderCookie = null;
-      if (typeof(that.dragColumn) === 'string') {
-        try {
-          columnOrderCookie = JSON.parse(getCookie(that.dragColumn));
-          that.setColumnMounted(columnOrderCookie);
-        }
-        catch(err){
-          return;
-        }
-      }
-    },
-    isCellHidden(index, columns) {
-      let start = 0;
-      for (let i = 0; i < index; i++) {
-        start += columns[i].colSpan;
-      }
-      const after = start + columns[index].colSpan - 1;
-      if (this.fixed === true || this.fixed === 'left') {
-        return after >= this.leftFixedLeafCount;
-      } else if (this.fixed === 'right') {
-        return start < this.columnsCount - this.rightFixedLeafCount;
-      } else {
-        return (after < this.leftFixedLeafCount) || (start >= this.columnsCount - this.rightFixedLeafCount);
-      }
-    },
-
-    getHeaderRowStyle(rowIndex) {
-      const headerRowStyle = this.table.headerRowStyle;
-      if (typeof headerRowStyle === 'function') {
-        return headerRowStyle.call(null, { rowIndex });
-      }
-      return headerRowStyle;
-    },
-
-    getHeaderRowClass(rowIndex) {
-      const classes = [];
-
-      const headerRowClassName = this.table.headerRowClassName;
-      if (typeof headerRowClassName === 'string') {
-        classes.push(headerRowClassName);
-      } else if (typeof headerRowClassName === 'function') {
-        classes.push(headerRowClassName.call(null, { rowIndex }));
-      }
-
-      return classes.join(' ');
-    },
-
-    getHeaderCellStyle(rowIndex, columnIndex, row, column) {
-      const headerCellStyle = this.table.headerCellStyle;
-      if (typeof headerCellStyle === 'function') {
-        return headerCellStyle.call(null, {
-          rowIndex,
-          columnIndex,
-          row,
-          column
-        });
-      }
-      return headerCellStyle;
-    },
-
-    getHeaderCellClass(rowIndex, columnIndex, row, column) {
-      const classes = [column.id, column.order, column.headerAlign, column.className, column.labelClassName];
-
-      if (rowIndex === 0 && this.isCellHidden(columnIndex, row)) {
-        classes.push('is-hidden');
-      }
-
-      if (!column.children) {
-        classes.push('is-leaf');
-      }
-
-      if (column.sortable) {
-        classes.push('is-sortable');
-      }
-
-      const headerCellClassName = this.table.headerCellClassName;
-      if (typeof headerCellClassName === 'string') {
-        classes.push(headerCellClassName);
-      } else if (typeof headerCellClassName === 'function') {
-        classes.push(headerCellClassName.call(null, {
-          rowIndex,
-          columnIndex,
-          row,
-          column
-        }));
-      }
-
-      return classes.join(' ');
-    },
-
-    toggleAllSelection() {
-      this.store.commit('toggleAllSelection');
-    },
-
-    handleFilterClick(event, column) {
-      event.stopPropagation();
-      const target = event.target;
-      let cell = target.tagName === 'TH' ? target : target.parentNode;
-      cell = cell.querySelector('.el-table__column-filter-trigger') || cell;
-      const table = this.$parent;
-
-      let filterPanel = this.filterPanels[column.id];
-
-      if (filterPanel && column.filterOpened) {
-        filterPanel.showPopper = false;
-        return;
-      }
-
-      if (!filterPanel) {
-        filterPanel = new Vue(FilterPanel);
-        this.filterPanels[column.id] = filterPanel;
-        if (column.filterPlacement) {
-          filterPanel.placement = column.filterPlacement;
-        }
-        filterPanel.table = table;
-        filterPanel.cell = cell;
-        filterPanel.column = column;
-        !this.$isServer && filterPanel.$mount(document.createElement('div'));
-      }
-
-      setTimeout(() => {
-        filterPanel.showPopper = true;
-      }, 16);
-    },
-
-    dropColumnSet(event, column) {
-      if(!(!column.fixed && this.dragColumn && column.level === 1)) {
-        return;
-      }
-      this.dragEnd = $(event.target).offset().left;
-      let target = event.target;
-      while (target && !$(target).hasClass('el-table')) {
-        target = target.parentNode;
-      }
-      this.setColumn(target);
-    },
-
-    setColumn(target) {
-      let that = this;
-      var ths = $(target).find('th');
-      var prevTargets = [];
-      var setTargets = [];
-      for (let i = 0; i < ths.length; i++) {
-        if ($(ths[i]).attr('draggable') === 'false') {
-          continue;
-        }
-        if ($(ths[i]).offset().left === that.dragStart) {
-          prevTargets.push(ths[i]);
-        }
-        if ($(ths[i]).offset().left === that.dragEnd) {
-          setTargets.push(ths[i]);
-        }
-      }
-      var preClassList = $(prevTargets[0])[0].classList;
-      var preId = '';
-      for (let i = 0; i < preClassList.length; i++) {
-        if (preClassList[i].indexOf('el-table_') > -1) {
-          preId = preClassList[i];
-        }
-      }
-      if (!$(setTargets[0])[0]) {
-        return;
-      }
-      var setClassList = $(setTargets[0])[0].classList;
-      var setId = '';
-      for (let i = 0; i < setClassList.length; i++) {
-        if (setClassList[i].indexOf('el-table_') > -1) {
-          setId = setClassList[i];
-        }
-      }
-      let array = this.store.states._columns;
-      let preIndex = 0;
-      let setIndex = 0;
-      for (let i = 0; i < array.length; i++) {
-        if (array[i].id === preId) {
-          preIndex = i;
-        }
-        if (array[i].id === setId) {
-          setIndex = i;
-        }
-      }
-      var temp = array[preIndex];
-      array.splice(setIndex,0,temp);
-      if (preIndex <= setIndex) {
-        array.splice(preIndex,1);
-      } else {
-        array.splice(preIndex+1,1);
-      }
-      if (typeof(that.dragColumn) === 'string') {
-        let temp = [];
-        for (let i = 0; i < array.length; i++) {
-          temp.push(array[i].label);
-        }
-        setCookie(that.dragColumn, JSON.stringify(temp), 9999, '/');
-      }
-      if (this.table.$ready) {
-        this.store.updateColumns(); // hack for dynamics remove column
-        this.store.scheduleLayout();
-      }
-    },
-
-    setColumnMounted(columnOrderCookie) {
-      let that = this;
-      that.$nextTick(function () {
-        let array = that.store.states._columns;
-        let temp = [];
-        for (let i = 0; i < columnOrderCookie.length; i++) {
-          for (let k = 0; k < array.length; k++) {
-            if (array[k].label === columnOrderCookie[i]) {
-              temp.push(array[k]);
-              continue;
-            }
-          }
-        }
-        that.store.states._columns = temp;
-        if (that.table.$ready) {
-          that.store.updateColumns(); // hack for dynamics remove column
-          that.store.scheduleLayout();
-        }
-      });
-      
-    },
-
-    dropColumnStart(event, column) {
-      if(!(!column.fixed && this.dragColumn && column.level === 1)) {
-        return;
-      }
-      this.dragStart = $(event.target).offset().left;
-    },
-
-    dropColumnOver(event, column) {
-      if(!(!column.fixed && this.dragColumn && column.level === 1)) {
-        return;
-      }
-      event.preventDefault();
-    },
-
-    handleHeaderClick(event, column) {
-      if (!column.filters && column.sortable) {
-        this.handleSortClick(event, column);
-      } else if (column.filters && !column.sortable) {
-        this.handleFilterClick(event, column);
-      }
-
-      this.$parent.$emit('header-click', column, event);
-    },
-
-    handleHeaderContextMenu(event, column) {
-      this.$parent.$emit('header-contextmenu', column, event);
-    },
-
-    handleMouseDown(event, column) {
-      if (this.$isServer) return;
-      if (column.children && column.children.length > 0) return;
-      /* istanbul ignore if */
-      if (this.draggingColumn && this.border) {
-        this.dragging = true;
-
-        this.$parent.resizeProxyVisible = true;
-
-        const table = this.$parent;
-        const tableEl = table.$el;
-        const tableLeft = tableEl.getBoundingClientRect().left;
-        const columnEl = this.$el.querySelector(`th.${column.id}`);
-        const columnRect = columnEl.getBoundingClientRect();
-        const minLeft = columnRect.left - tableLeft + 30;
-
-        addClass(columnEl, 'noclick');
-
-        this.dragState = {
-          startMouseLeft: event.clientX,
-          startLeft: columnRect.right - tableLeft,
-          startColumnLeft: columnRect.left - tableLeft,
-          tableLeft
-        };
-
-        const resizeProxy = table.$refs.resizeProxy;
-        resizeProxy.style.left = this.dragState.startLeft + 'px';
-
-        document.onselectstart = function() { return false; };
-        document.ondragstart = function() { return false; };
-
-        const handleMouseMove = (event) => {
-          const deltaLeft = event.clientX - this.dragState.startMouseLeft;
-          const proxyLeft = this.dragState.startLeft + deltaLeft;
-
-          resizeProxy.style.left = Math.max(minLeft, proxyLeft) + 'px';
-        };
-
-        const handleMouseUp = () => {
-          if (this.dragging) {
-            const {
-              startColumnLeft,
-              startLeft
-            } = this.dragState;
-            const finalLeft = parseInt(resizeProxy.style.left, 10);
-            const columnWidth = finalLeft - startColumnLeft;
-            column.width = column.realWidth = columnWidth;
-            table.$emit('header-dragend', column.width, startLeft - startColumnLeft, column, event);
-
-            this.store.scheduleLayout();
-
-            document.body.style.cursor = '';
-            this.dragging = false;
-            this.draggingColumn = null;
-            this.dragState = {};
-
-            table.resizeProxyVisible = false;
-          }
-
-          document.removeEventListener('mousemove', handleMouseMove);
-          document.removeEventListener('mouseup', handleMouseUp);
-          document.onselectstart = null;
-          document.ondragstart = null;
-
-          setTimeout(function() {
-            removeClass(columnEl, 'noclick');
-          }, 0);
-        };
-
-        document.addEventListener('mousemove', handleMouseMove);
-        document.addEventListener('mouseup', handleMouseUp);
-      }
-    },
-
-    handleMouseMove(event, column) {
-      if (column.children && column.children.length > 0) return;
-      let target = event.target;
-      while (target && target.tagName !== 'TH') {
-        target = target.parentNode;
-      }
-
-      if (!column || !column.resizable) return;
-
-      if (!this.dragging && this.border) {
-        let rect = target.getBoundingClientRect();
-
-        const bodyStyle = document.body.style;
-        if (rect.width > 12 && rect.right - event.pageX < 8) {
-          bodyStyle.cursor = 'col-resize';
-          if (hasClass(target, 'is-sortable')) {
-            target.style.cursor = 'col-resize';
-          }
-          this.draggingColumn = column;
-        } else if (!this.dragging) {
-          bodyStyle.cursor = '';
-          if (hasClass(target, 'is-sortable')) {
-            target.style.cursor = 'pointer';
-          }
-          this.draggingColumn = null;
-        }
-      }
-    },
-
-    handleMouseOut() {
-      if (this.$isServer) return;
-      document.body.style.cursor = '';
-    },
-
-    toggleOrder({ order, sortOrders }) {
-      if (order === '') return sortOrders[0];
-      const index = sortOrders.indexOf(order || null);
-      return sortOrders[index > sortOrders.length - 2 ? 0 : index + 1];
-    },
-
-    handleSortClick(event, column, givenOrder) {
-      event.stopPropagation();
-      let order = givenOrder || this.toggleOrder(column);
-
-      let target = event.target;
-      while (target && target.tagName !== 'TH') {
-        target = target.parentNode;
-      }
-
-      if (target && target.tagName === 'TH') {
-        if (hasClass(target, 'noclick')) {
-          removeClass(target, 'noclick');
-          return;
-        }
-      }
-
-      if (!column.sortable) return;
-
-      const states = this.store.states;
-      let sortProp = states.sortProp;
-      let sortOrder;
-      const sortingColumn = states.sortingColumn;
-
-      if (sortingColumn !== column || (sortingColumn === column && sortingColumn.order === null)) {
-        if (sortingColumn) {
-          sortingColumn.order = null;
-        }
-        states.sortingColumn = column;
-        sortProp = column.property;
-      }
-
-      if (!order) {
-        sortOrder = column.order = null;
-        states.sortingColumn = null;
-        sortProp = null;
-      } else {
-        sortOrder = column.order = order;
-      }
-
-      states.sortProp = sortProp;
-      states.sortOrder = sortOrder;
-
-      this.store.commit('changeSortCondition');
-    }
-  },
-
-  data() {
-    return {
-      draggingColumn: null,
-      dragging: false,
-      dragState: {},
-      dragStart: 0,
-      dragEnd: 0
-    };
-  }
-};

src/lib/el-table/src/table-layout.js

@@ -1,231 +0,0 @@
-import scrollbarWidth from 'element-ui/src/utils/scrollbar-width';
-import Vue from 'vue';
-
-class TableLayout {
-  constructor(options) {
-    this.observers = [];
-    this.table = null;
-    this.store = null;
-    this.columns = null;
-    this.fit = true;
-    this.showHeader = true;
-
-    this.height = null;
-    this.scrollX = false;
-    this.scrollY = false;
-    this.bodyWidth = null;
-    this.fixedWidth = null;
-    this.rightFixedWidth = null;
-    this.tableHeight = null;
-    this.headerHeight = 44; // Table Header Height
-    this.appendHeight = 0; // Append Slot Height
-    this.footerHeight = 44; // Table Footer Height
-    this.viewportHeight = null; // Table Height - Scroll Bar Height
-    this.bodyHeight = null; // Table Height - Table Header Height
-    this.fixedBodyHeight = null; // Table Height - Table Header Height - Scroll Bar Height
-    this.gutterWidth = scrollbarWidth();
-
-    for (let name in options) {
-      if (options.hasOwnProperty(name)) {
-        this[name] = options[name];
-      }
-    }
-
-    if (!this.table) {
-      throw new Error('table is required for Table Layout');
-    }
-    if (!this.store) {
-      throw new Error('store is required for Table Layout');
-    }
-  }
-
-  updateScrollY() {
-    const height = this.height;
-    if (typeof height !== 'string' && typeof height !== 'number') return;
-    const bodyWrapper = this.table.bodyWrapper;
-    if (this.table.$el && bodyWrapper) {
-      const body = bodyWrapper.querySelector('.el-table__body');
-      this.scrollY = body.offsetHeight > this.bodyHeight;
-    }
-  }
-
-  setHeight(value, prop = 'height') {
-    if (Vue.prototype.$isServer) return;
-    const el = this.table.$el;
-    if (typeof value === 'string' && /^\d+$/.test(value)) {
-      value = Number(value);
-    }
-    this.height = value;
-
-    if (!el && (value || value === 0)) return Vue.nextTick(() => this.setHeight(value, prop));
-
-    if (typeof value === 'number') {
-      el.style[prop] = value + 'px';
-
-      this.updateElsHeight();
-    } else if (typeof value === 'string') {
-      el.style[prop] = value;
-      this.updateElsHeight();
-    }
-  }
-
-  setMaxHeight(value) {
-    return this.setHeight(value, 'max-height');
-  }
-
-  updateElsHeight() {
-    if (!this.table.$ready) return Vue.nextTick(() => this.updateElsHeight());
-    const { headerWrapper, appendWrapper, footerWrapper } = this.table.$refs;
-    this.appendHeight = appendWrapper ? appendWrapper.offsetHeight : 0;
-
-    if (this.showHeader && !headerWrapper) return;
-    const headerHeight = this.headerHeight = !this.showHeader ? 0 : headerWrapper.offsetHeight;
-    if (this.showHeader && headerWrapper.offsetWidth > 0 && (this.table.columns || []).length > 0 && headerHeight < 2) {
-      return Vue.nextTick(() => this.updateElsHeight());
-    }
-    const tableHeight = this.tableHeight = this.table.$el.clientHeight;
-    if (this.height !== null && (!isNaN(this.height) || typeof this.height === 'string')) {
-      const footerHeight = this.footerHeight = footerWrapper ? footerWrapper.offsetHeight : 0;
-      this.bodyHeight = tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0);
-    }
-    this.fixedBodyHeight = this.scrollX ? this.bodyHeight - this.gutterWidth : this.bodyHeight;
-
-    const noData = !this.table.data || this.table.data.length === 0;
-    this.viewportHeight = this.scrollX ? tableHeight - (noData ? 0 : this.gutterWidth) : tableHeight;
-
-    this.updateScrollY();
-    this.notifyObservers('scrollable');
-  }
-
-  getFlattenColumns() {
-    const flattenColumns = [];
-    const columns = this.table.columns;
-    columns.forEach((column) => {
-      if (column.isColumnGroup) {
-        flattenColumns.push.apply(flattenColumns, column.columns);
-      } else {
-        flattenColumns.push(column);
-      }
-    });
-
-    return flattenColumns;
-  }
-
-  updateColumnsWidth() {
-    if (Vue.prototype.$isServer) return;
-    const fit = this.fit;
-    const bodyWidth = this.table.$el.clientWidth;
-    let bodyMinWidth = 0;
-
-    const flattenColumns = this.getFlattenColumns();
-    let flexColumns = flattenColumns.filter((column) => typeof column.width !== 'number');
-
-    flattenColumns.forEach((column) => { // Clean those columns whose width changed from flex to unflex
-      if (typeof column.width === 'number' && column.realWidth) column.realWidth = null;
-    });
-
-    if (flexColumns.length > 0 && fit) {
-      flattenColumns.forEach((column) => {
-        bodyMinWidth += column.width || column.minWidth || 80;
-      });
-
-      const scrollYWidth = this.scrollY ? this.gutterWidth : 0;
-
-      if (bodyMinWidth <= bodyWidth - scrollYWidth) { // DON'T HAVE SCROLL BAR
-        this.scrollX = false;
-
-        const totalFlexWidth = bodyWidth - scrollYWidth - bodyMinWidth;
-
-        if (flexColumns.length === 1) {
-          flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth;
-        } else {
-          const allColumnsWidth = flexColumns.reduce((prev, column) => prev + (column.minWidth || 80), 0);
-          const flexWidthPerPixel = totalFlexWidth / allColumnsWidth;
-          let noneFirstWidth = 0;
-
-          flexColumns.forEach((column, index) => {
-            if (index === 0) return;
-            const flexWidth = Math.floor((column.minWidth || 80) * flexWidthPerPixel);
-            noneFirstWidth += flexWidth;
-            column.realWidth = (column.minWidth || 80) + flexWidth;
-          });
-
-          flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth - noneFirstWidth;
-        }
-      } else { // HAVE HORIZONTAL SCROLL BAR
-        this.scrollX = true;
-        flexColumns.forEach(function(column) {
-          column.realWidth = column.minWidth;
-        });
-      }
-
-      this.bodyWidth = Math.max(bodyMinWidth, bodyWidth);
-      this.table.resizeState.width = this.bodyWidth;
-    } else {
-      flattenColumns.forEach((column) => {
-        if (!column.width && !column.minWidth) {
-          column.realWidth = 80;
-        } else {
-          column.realWidth = column.width || column.minWidth;
-        }
-
-        bodyMinWidth += column.realWidth;
-      });
-      this.scrollX = bodyMinWidth > bodyWidth;
-
-      this.bodyWidth = bodyMinWidth;
-    }
-
-    const fixedColumns = this.store.states.fixedColumns;
-
-    if (fixedColumns.length > 0) {
-      let fixedWidth = 0;
-      fixedColumns.forEach(function(column) {
-        fixedWidth += column.realWidth || column.width;
-      });
-
-      this.fixedWidth = fixedWidth;
-    }
-
-    const rightFixedColumns = this.store.states.rightFixedColumns;
-    if (rightFixedColumns.length > 0) {
-      let rightFixedWidth = 0;
-      rightFixedColumns.forEach(function(column) {
-        rightFixedWidth += column.realWidth || column.width;
-      });
-
-      this.rightFixedWidth = rightFixedWidth;
-    }
-
-    this.notifyObservers('columns');
-  }
-
-  addObserver(observer) {
-    this.observers.push(observer);
-  }
-
-  removeObserver(observer) {
-    const index = this.observers.indexOf(observer);
-    if (index !== -1) {
-      this.observers.splice(index, 1);
-    }
-  }
-
-  notifyObservers(event) {
-    const observers = this.observers;
-    observers.forEach((observer) => {
-      switch (event) {
-        case 'columns':
-          observer.onColumnsChange(this);
-          break;
-        case 'scrollable':
-          observer.onScrollableChange(this);
-          break;
-        default:
-          throw new Error(`Table Layout don't have event ${event}.`);
-      }
-    });
-  }
-}
-
-export default TableLayout;

src/lib/el-table/src/table-store.js

@@ -1,650 +0,0 @@
-import Vue from 'vue';
-import debounce from 'throttle-debounce/debounce';
-import merge from 'element-ui/src/utils/merge';
-import { hasClass, addClass, removeClass } from 'element-ui/src/utils/dom';
-import { orderBy, getColumnById, getRowIdentity } from './util';
-
-let filterColumnWatch = function (data = [], tableColumns = {}, _filters = []) {
-  for (let i = 0; i < tableColumns.length; i++) {
-    let filters = [];
-    let tableColumn = tableColumns[i];
-    let property = tableColumn.property;
-    for (let i in data) {
-      let flag = true;
-      var set = data[i][property] || data[i][property] === 0 ? (data[i][property] + '') : '';
-      for (let j in filters) {
-        
-        if ((filters[j].value + '') === (set)) {
-          flag = false;
-          break;
-        }
-      }
-      if (flag) {
-        filters.push({
-          value: set,
-          text: set
-        })
-      }
-    }
-    tableColumn.filters = filters;
-  }
-}
-
-const sortData = (data, states) => {
-  const sortingColumn = states.sortingColumn;
-  if (!sortingColumn || typeof sortingColumn.sortable === 'string') {
-    return data;
-  }
-  return orderBy(data, states.sortProp, states.sortOrder, sortingColumn.sortMethod, sortingColumn.sortBy);
-};
-
-const getKeysMap = function(array, rowKey) {
-  const arrayMap = {};
-  (array || []).forEach((row, index) => {
-    arrayMap[getRowIdentity(row, rowKey)] = { row, index };
-  });
-  return arrayMap;
-};
-
-const toggleRowSelection = function(states, row, selected) {
-  let changed = false;
-  const selection = states.selection;
-  const index = selection.indexOf(row);
-  if (typeof selected === 'undefined') {
-    if (index === -1) {
-      selection.push(row);
-      changed = true;
-    } else {
-      selection.splice(index, 1);
-      changed = true;
-    }
-  } else {
-    if (selected && index === -1) {
-      selection.push(row);
-      changed = true;
-    } else if (!selected && index > -1) {
-      selection.splice(index, 1);
-      changed = true;
-    }
-  }
-
-  return changed;
-};
-
-const toggleRowExpansion = function(states, row, expanded) {
-  let changed = false;
-  const expandRows = states.expandRows;
-  if (typeof expanded !== 'undefined') {
-    const index = expandRows.indexOf(row);
-    if (expanded) {
-      if (index === -1) {
-        expandRows.push(row);
-        changed = true;
-      }
-    } else {
-      if (index !== -1) {
-        expandRows.splice(index, 1);
-        changed = true;
-      }
-    }
-  } else {
-    const index = expandRows.indexOf(row);
-    if (index === -1) {
-      expandRows.push(row);
-      changed = true;
-    } else {
-      expandRows.splice(index, 1);
-      changed = true;
-    }
-  }
-
-  return changed;
-};
-
-const TableStore = function(table, initialState = {}) {
-  if (!table) {
-    throw new Error('Table is required.');
-  }
-  this.table = table;
-
-  this.states = {
-    rowKey: null,
-    _columns: [],
-    originColumns: [],
-    columns: [],
-    fixedColumns: [],
-    rightFixedColumns: [],
-    leafColumns: [],
-    fixedLeafColumns: [],
-    rightFixedLeafColumns: [],
-    leafColumnsLength: 0,
-    fixedLeafColumnsLength: 0,
-    rightFixedLeafColumnsLength: 0,
-    isComplex: false,
-    filteredData: null,
-    data: null,
-    sortingColumn: null,
-    sortProp: null,
-    sortOrder: null,
-    isAllSelected: false,
-    selection: [],
-    reserveSelection: false,
-    selectable: null,
-    currentRow: null,
-    hoverRow: null,
-    filters: {},
-    expandRows: [],
-    defaultExpandAll: false,
-    selectOnIndeterminate: false
-  };
-
-  for (let prop in initialState) {
-    if (initialState.hasOwnProperty(prop) && this.states.hasOwnProperty(prop)) {
-      this.states[prop] = initialState[prop];
-    }
-  }
-};
-
-TableStore.prototype.mutations = {
-  setData(states, data) {
-    const dataInstanceChanged = states._data !== data;
-    states._data = data;
-
-    Object.keys(states.filters).forEach((columnId) => {
-      const values = states.filters[columnId];
-      if (!values || values.length === 0) return;
-      const column = getColumnById(this.states, columnId);
-      if (column && column.filterMethod) {
-        data = data.filter((row) => {
-          return values.some(value => column.filterMethod.call(null, value, row, column));
-        });
-      }
-    });
-
-    states.filteredData = data;
-    states.data = sortData((data || []), states);
-
-    this.updateCurrentRow();
-
-    const rowKey = states.rowKey;
-
-    if (!states.reserveSelection) {
-      if (dataInstanceChanged) {
-        this.clearSelection();
-      } else {
-        this.cleanSelection();
-      }
-      this.updateAllSelected();
-    } else {
-      if (rowKey) {
-        const selection = states.selection;
-        const selectedMap = getKeysMap(selection, rowKey);
-
-        states.data.forEach((row) => {
-          const rowId = getRowIdentity(row, rowKey);
-          const rowInfo = selectedMap[rowId];
-          if (rowInfo) {
-            selection[rowInfo.index] = row;
-          }
-        });
-
-        this.updateAllSelected();
-      } else {
-        console.warn('WARN: rowKey is required when reserve-selection is enabled.');
-      }
-    }
-
-    const defaultExpandAll = states.defaultExpandAll;
-    if (defaultExpandAll) {
-      this.states.expandRows = (states.data || []).slice(0);
-    } else if (rowKey) {
-      // update expandRows to new rows according to rowKey
-      const ids = getKeysMap(this.states.expandRows, rowKey);
-      let expandRows = [];
-      for (const row of states.data) {
-        const rowId = getRowIdentity(row, rowKey);
-        if (ids[rowId]) {
-          expandRows.push(row);
-        }
-      }
-      this.states.expandRows = expandRows;
-    } else {
-      // clear the old rows
-      this.states.expandRows = [];
-    }
-    Vue.nextTick(() => this.table.updateScrollY());
-  },
-
-  changeSortCondition(states, options) {
-    states.data = sortData((states.filteredData || states._data || []), states);
-
-    const { $el, highlightCurrentRow } = this.table;
-    if ($el && highlightCurrentRow) {
-      const data = states.data;
-      const tr = $el.querySelector('tbody').children;
-      const rows = [].filter.call(tr, row => hasClass(row, 'el-table__row'));
-      const row = rows[data.indexOf(states.currentRow)];
-
-      [].forEach.call(rows, row => removeClass(row, 'current-row'));
-      addClass(row, 'current-row');
-    }
-
-    if (!options || !options.silent) {
-      this.table.$emit('sort-change', {
-        column: this.states.sortingColumn,
-        prop: this.states.sortProp,
-        order: this.states.sortOrder
-      });
-    }
-
-    Vue.nextTick(() => this.table.updateScrollY());
-  },
-
-  sort(states, options) {
-    const { prop, order } = options;
-    if (prop) {
-      states.sortProp = prop;
-      states.sortOrder = order || 'ascending';
-      Vue.nextTick(() => {
-        for (let i = 0, length = states.columns.length; i < length; i++) {
-          let column = states.columns[i];
-          if (column.property === states.sortProp) {
-            column.order = states.sortOrder;
-            states.sortingColumn = column;
-            break;
-          }
-        }
-
-        if (states.sortingColumn) {
-          this.commit('changeSortCondition');
-        }
-      });
-    }
-  },
-
-  filterChange(states, options) {
-    let { column, values, silent } = options;
-    if (values && !Array.isArray(values)) {
-      values = [values];
-    }
-
-    const prop = column.property;
-    const filters = {};
-
-    if (prop) {
-      states.filters[column.id] = values;
-      filters[column.columnKey || column.id] = values;
-    }
-
-    let data = states._data;
-
-    Object.keys(states.filters).forEach((columnId) => {
-      const values = states.filters[columnId];
-      if (!values || values.length === 0) return;
-      const column = getColumnById(this.states, columnId);
-      if (column && column.filterMethod) {
-        data = data.filter((row) => {
-          return values.some(value => column.filterMethod.call(null, value, row, column));
-        });
-      }
-    });
-
-    states.filteredData = data;
-    states.data = sortData(data, states);
-
-    if (!silent) {
-      // let filteredData = this.table.tableData;
-      // filterColumnWatch(filteredData, this.table.columns, filters)
-      this.table.$emit('filter-change', filters);
-    }
-
-    Vue.nextTick(() => this.table.updateScrollY());
-  },  
-
-  insertColumn(states, column, index, parent) {
-    let array = states._columns;
-    if (parent) {
-      array = parent.children;
-      if (!array) array = parent.children = [];
-    }
-
-    if (typeof index !== 'undefined') {
-      array.splice(index, 0, column);
-    } else {
-      array.push(column);
-    }
-
-    if (column.type === 'selection') {
-      states.selectable = column.selectable;
-      states.reserveSelection = column.reserveSelection;
-    }
-
-    if (this.table.$ready) {
-      this.updateColumns(); // hack for dynamics insert column
-      this.scheduleLayout();
-    }
-  },
-
-  removeColumn(states, column, parent) {
-    let array = states._columns;
-    if (parent) {
-      array = parent.children;
-      if (!array) array = parent.children = [];
-    }
-    if (array) {
-      array.splice(array.indexOf(column), 1);
-    }
-
-    if (this.table.$ready) {
-      this.updateColumns(); // hack for dynamics remove column
-      this.scheduleLayout();
-    }
-  },
-
-  setHoverRow(states, row) {
-    states.hoverRow = row;
-  },
-
-  setCurrentRow(states, row) {
-    const oldCurrentRow = states.currentRow;
-    states.currentRow = row;
-
-    if (oldCurrentRow !== row) {
-      this.table.$emit('current-change', row, oldCurrentRow);
-    }
-  },
-
-  rowSelectedChanged(states, row) {
-    const changed = toggleRowSelection(states, row);
-    const selection = states.selection;
-
-    if (changed) {
-      const table = this.table;
-      table.$emit('selection-change', selection ? selection.slice() : []);
-      table.$emit('select', selection, row);
-    }
-
-    this.updateAllSelected();
-  },
-
-  toggleAllSelection: debounce(10, function(states) {
-    const data = states.data || [];
-    if (data.length === 0) return;
-    const selection = this.states.selection;
-    // when only some rows are selected (but not all), select or deselect all of them
-    // depending on the value of selectOnIndeterminate
-    const value = states.selectOnIndeterminate
-      ? !states.isAllSelected
-      : !(states.isAllSelected || selection.length);
-    let selectionChanged = false;
-
-    data.forEach((item, index) => {
-      if (states.selectable) {
-        if (states.selectable.call(null, item, index) && toggleRowSelection(states, item, value)) {
-          selectionChanged = true;
-        }
-      } else {
-        if (toggleRowSelection(states, item, value)) {
-          selectionChanged = true;
-        }
-      }
-    });
-
-    const table = this.table;
-    if (selectionChanged) {
-      table.$emit('selection-change', selection ? selection.slice() : []);
-    }
-    table.$emit('select-all', selection);
-    states.isAllSelected = value;
-  })
-};
-
-const doFlattenColumns = (columns) => {
-  const result = [];
-  columns.forEach((column) => {
-    if (column.children) {
-      result.push.apply(result, doFlattenColumns(column.children));
-    } else {
-      result.push(column);
-    }
-  });
-  return result;
-};
-
-TableStore.prototype.updateColumns = function() {
-  const states = this.states;
-  const _columns = states._columns || [];
-  states.fixedColumns = _columns.filter((column) => column.fixed === true || column.fixed === 'left');
-  states.rightFixedColumns = _columns.filter((column) => column.fixed === 'right');
-
-  if (states.fixedColumns.length > 0 && _columns[0] && _columns[0].type === 'selection' && !_columns[0].fixed) {
-    _columns[0].fixed = true;
-    states.fixedColumns.unshift(_columns[0]);
-  }
-
-  const notFixedColumns = _columns.filter(column => !column.fixed);
-  states.originColumns = [].concat(states.fixedColumns).concat(notFixedColumns).concat(states.rightFixedColumns);
-
-  const leafColumns = doFlattenColumns(notFixedColumns);
-  const fixedLeafColumns = doFlattenColumns(states.fixedColumns);
-  const rightFixedLeafColumns = doFlattenColumns(states.rightFixedColumns);
-
-  states.leafColumnsLength = leafColumns.length;
-  states.fixedLeafColumnsLength = fixedLeafColumns.length;
-  states.rightFixedLeafColumnsLength = rightFixedLeafColumns.length;
-
-  states.columns = [].concat(fixedLeafColumns).concat(leafColumns).concat(rightFixedLeafColumns);
-  states.isComplex = states.fixedColumns.length > 0 || states.rightFixedColumns.length > 0;
-};
-
-TableStore.prototype.isSelected = function(row) {
-  return (this.states.selection || []).indexOf(row) > -1;
-};
-
-TableStore.prototype.clearSelection = function() {
-  const states = this.states;
-  states.isAllSelected = false;
-  const oldSelection = states.selection;
-  if (states.selection.length) {
-    states.selection = [];
-  }
-  if (oldSelection.length > 0) {
-    this.table.$emit('selection-change', states.selection ? states.selection.slice() : []);
-  }
-};
-
-TableStore.prototype.setExpandRowKeys = function(rowKeys) {
-  const expandRows = [];
-  const data = this.states.data;
-  const rowKey = this.states.rowKey;
-  if (!rowKey) throw new Error('[Table] prop row-key should not be empty.');
-  const keysMap = getKeysMap(data, rowKey);
-  rowKeys.forEach((key) => {
-    const info = keysMap[key];
-    if (info) {
-      expandRows.push(info.row);
-    }
-  });
-
-  this.states.expandRows = expandRows;
-};
-
-TableStore.prototype.toggleRowSelection = function(row, selected) {
-  const changed = toggleRowSelection(this.states, row, selected);
-  if (changed) {
-    this.table.$emit('selection-change', this.states.selection ? this.states.selection.slice() : []);
-  }
-};
-
-TableStore.prototype.toggleRowExpansion = function(row, expanded) {
-  const changed = toggleRowExpansion(this.states, row, expanded);
-  if (changed) {
-    this.table.$emit('expand-change', row, this.states.expandRows);
-    this.scheduleLayout();
-  }
-};
-
-TableStore.prototype.isRowExpanded = function(row) {
-  const { expandRows = [], rowKey } = this.states;
-  if (rowKey) {
-    const expandMap = getKeysMap(expandRows, rowKey);
-    return !!expandMap[getRowIdentity(row, rowKey)];
-  }
-  return expandRows.indexOf(row) !== -1;
-};
-
-TableStore.prototype.cleanSelection = function() {
-  const selection = this.states.selection || [];
-  const data = this.states.data;
-  const rowKey = this.states.rowKey;
-  let deleted;
-  if (rowKey) {
-    deleted = [];
-    const selectedMap = getKeysMap(selection, rowKey);
-    const dataMap = getKeysMap(data, rowKey);
-    for (let key in selectedMap) {
-      if (selectedMap.hasOwnProperty(key) && !dataMap[key]) {
-        deleted.push(selectedMap[key].row);
-      }
-    }
-  } else {
-    deleted = selection.filter((item) => {
-      return data.indexOf(item) === -1;
-    });
-  }
-
-  deleted.forEach((deletedItem) => {
-    selection.splice(selection.indexOf(deletedItem), 1);
-  });
-
-  if (deleted.length) {
-    this.table.$emit('selection-change', selection ? selection.slice() : []);
-  }
-};
-
-TableStore.prototype.clearFilter = function() {
-  const states = this.states;
-  const { tableHeader, fixedTableHeader, rightFixedTableHeader } = this.table.$refs;
-  let panels = {};
-
-  if (tableHeader) panels = merge(panels, tableHeader.filterPanels);
-  if (fixedTableHeader) panels = merge(panels, fixedTableHeader.filterPanels);
-  if (rightFixedTableHeader) panels = merge(panels, rightFixedTableHeader.filterPanels);
-
-  const keys = Object.keys(panels);
-  if (!keys.length) return;
-
-  keys.forEach(key => {
-    panels[key].filteredValue = [];
-  });
-
-  states.filters = {};
-
-  this.commit('filterChange', {
-    column: {},
-    values: [],
-    silent: true
-  });
-};
-
-TableStore.prototype.clearSort = function() {
-  const states = this.states;
-  if (!states.sortingColumn) return;
-  states.sortingColumn.order = null;
-  states.sortProp = null;
-  states.sortOrder = null;
-
-  this.commit('changeSortCondition', {
-    silent: true
-  });
-};
-
-TableStore.prototype.updateAllSelected = function() {
-  const states = this.states;
-  const { selection, rowKey, selectable, data } = states;
-  if (!data || data.length === 0) {
-    states.isAllSelected = false;
-    return;
-  }
-
-  let selectedMap;
-  if (rowKey) {
-    selectedMap = getKeysMap(states.selection, rowKey);
-  }
-
-  const isSelected = function(row) {
-    if (selectedMap) {
-      return !!selectedMap[getRowIdentity(row, rowKey)];
-    } else {
-      return selection.indexOf(row) !== -1;
-    }
-  };
-
-  let isAllSelected = true;
-  let selectedCount = 0;
-  for (let i = 0, j = data.length; i < j; i++) {
-    const item = data[i];
-    const isRowSelectable = selectable && selectable.call(null, item, i);
-    if (!isSelected(item)) {
-      if (!selectable || isRowSelectable) {
-        isAllSelected = false;
-        break;
-      }
-    } else {
-      selectedCount++;
-    }
-  }
-
-  if (selectedCount === 0) isAllSelected = false;
-
-  states.isAllSelected = isAllSelected;
-};
-
-TableStore.prototype.scheduleLayout = function(updateColumns) {
-  if (updateColumns) {
-    this.updateColumns();
-  }
-  this.table.debouncedUpdateLayout();
-};
-
-TableStore.prototype.setCurrentRowKey = function(key) {
-  const states = this.states;
-  const rowKey = states.rowKey;
-  if (!rowKey) throw new Error('[Table] row-key should not be empty.');
-  const data = states.data || [];
-  const keysMap = getKeysMap(data, rowKey);
-  const info = keysMap[key];
-  if (info) {
-    states.currentRow = info.row;
-  }
-};
-
-TableStore.prototype.updateCurrentRow = function() {
-  const states = this.states;
-  const table = this.table;
-  const data = states.data || [];
-  const oldCurrentRow = states.currentRow;
-
-  if (data.indexOf(oldCurrentRow) === -1) {
-    states.currentRow = null;
-
-    if (states.currentRow !== oldCurrentRow) {
-      table.$emit('current-change', null, oldCurrentRow);
-    }
-  }
-};
-
-TableStore.prototype.commit = function(name, ...args) {
-  const mutations = this.mutations;
-  if (mutations[name]) {
-    mutations[name].apply(this, [this.states].concat(args));
-  } else {
-    throw new Error(`Action not found: ${name}`);
-  }
-};
-
-TableStore.prototype.changeRowOrder = function(startIndex, endIndex) {
-  this.table.$emit('changeRowOrder', startIndex, endIndex)
-};
-
-export default TableStore;

src/lib/el-table/src/table.vue

@@ -1,666 +0,0 @@
-<template>
-  <div class="el-table"
-    :class="[{
-      'el-table--fit': fit,
-      'el-table--striped': stripe,
-      'el-table--border': border || isGroup,
-      'el-table--hidden': isHidden,
-      'el-table--group': isGroup,
-      'el-table--fluid-height': maxHeight,
-      'el-table--scrollable-x': layout.scrollX,
-      'el-table--scrollable-y': layout.scrollY,
-      'el-table--enable-row-hover': !store.states.isComplex,
-      'el-table--enable-row-transition': (store.states.data || []).length !== 0 && (store.states.data || []).length < 100
-    }, tableSize ? `el-table--${ tableSize }` : '']"
-    @mouseleave="handleMouseLeave($event)">
-    <div class="hidden-columns" ref="hiddenColumns"><slot></slot></div>
-    <div
-      v-if="showHeader"
-      v-mousewheel="handleHeaderFooterMousewheel"
-      class="el-table__header-wrapper"
-      ref="headerWrapper">
-      <table-header
-        ref="tableHeader"
-        :store="store"
-        :dragColumn="dragColumn"
-        :border="border"
-        :default-sort="defaultSort"
-        :style="{
-          width: layout.bodyWidth ? layout.bodyWidth + 'px' : ''
-        }">
-      </table-header>
-    </div>
-    <div
-      class="el-table__body-wrapper"
-      ref="bodyWrapper"
-      :class="[layout.scrollX ? `is-scrolling-${scrollPosition}` : 'is-scrolling-none']"
-      :style="[bodyHeight]">
-      <table-body
-        :dragRow="dragRow"
-        :context="context"
-        :store="store"
-        :stripe="stripe"
-        :row-class-name="rowClassName"
-        :row-style="rowStyle"
-        :highlight="highlightCurrentRow"
-        :style="{
-           width: bodyWidth
-        }">
-      </table-body>
-      <div
-        v-if="!data || data.length === 0"
-        class="el-table__empty-block"
-        ref="emptyBlock"
-        :style="{
-          width: bodyWidth
-        }">
-        <span class="el-table__empty-text">
-          <slot name="empty">{{ emptyText || t('el.table.emptyText') }}</slot>
-        </span>
-      </div>
-      <div
-        v-if="$slots.append"
-        class="el-table__append-wrapper"
-        ref="appendWrapper">
-        <slot name="append"></slot>
-      </div>
-    </div>
-    <div
-      v-if="showSummary"
-      v-show="data && data.length > 0"
-      v-mousewheel="handleHeaderFooterMousewheel"
-      class="el-table__footer-wrapper"
-      ref="footerWrapper">
-      <table-footer
-        :store="store"
-        :border="border"
-        :sum-text="sumText || t('el.table.sumText')"
-        :summary-method="summaryMethod"
-        :default-sort="defaultSort"
-        :style="{
-          width: layout.bodyWidth ? layout.bodyWidth + 'px' : ''
-        }">
-      </table-footer>
-    </div>
-    <div
-      v-if="fixedColumns.length > 0"
-      v-mousewheel="handleFixedMousewheel"
-      class="el-table__fixed"
-      ref="fixedWrapper"
-      :style="[{
-        width: layout.fixedWidth ? layout.fixedWidth + 'px' : ''
-      },
-      fixedHeight]">
-      <div
-        v-if="showHeader"
-        class="el-table__fixed-header-wrapper"
-        ref="fixedHeaderWrapper" >
-        <table-header
-          ref="fixedTableHeader"
-          fixed="left"
-          :border="border"
-          :dragColumn="dragColumn"
-          :store="store"
-          :style="{
-            width: bodyWidth
-          }"></table-header>
-      </div>
-      <div
-        class="el-table__fixed-body-wrapper"
-        ref="fixedBodyWrapper"
-        :style="[{
-          top: layout.headerHeight + 'px'
-        },
-        fixedBodyHeight]">
-        <table-body
-          fixed="left"
-          :dragRow="dragRow"
-          :store="store"
-          :stripe="stripe"
-          :highlight="highlightCurrentRow"
-          :row-class-name="rowClassName"
-          :row-style="rowStyle"
-          :style="{
-            width: bodyWidth
-          }">
-        </table-body>
-        <div
-          v-if="$slots.append"
-          class="el-table__append-gutter"
-          :style="{
-            height: layout.appendHeight + 'px'
-          }"></div>
-      </div>
-      <div
-        v-if="showSummary"
-        v-show="data && data.length > 0"
-        class="el-table__fixed-footer-wrapper"
-        ref="fixedFooterWrapper">
-        <table-footer
-          fixed="left"
-          :border="border"
-          :sum-text="sumText || t('el.table.sumText')"
-          :summary-method="summaryMethod"
-          :store="store"
-          :style="{
-            width: bodyWidth
-          }"></table-footer>
-      </div>
-    </div>
-    <div
-      v-if="rightFixedColumns.length > 0"
-      v-mousewheel="handleFixedMousewheel"
-      class="el-table__fixed-right"
-      ref="rightFixedWrapper"
-      :style="[{
-        width: layout.rightFixedWidth ? layout.rightFixedWidth + 'px' : '',
-        right: layout.scrollY ? (border ? layout.gutterWidth : (layout.gutterWidth || 0)) + 'px' : ''
-      },
-      fixedHeight]">
-      <div v-if="showHeader"
-        class="el-table__fixed-header-wrapper"
-        ref="rightFixedHeaderWrapper">
-        <table-header
-          ref="rightFixedTableHeader"
-          fixed="right"
-          :border="border"
-          :store="store"
-          :dragColumn="dragColumn"
-          :style="{
-            width: bodyWidth
-          }"></table-header>
-      </div>
-      <div
-        class="el-table__fixed-body-wrapper"
-        ref="rightFixedBodyWrapper"
-        :style="[{
-          top: layout.headerHeight + 'px'
-        },
-        fixedBodyHeight]">
-        <table-body
-          fixed="right"
-          :dragRow="dragRow"
-          :store="store"          
-          :stripe="stripe"
-          :row-class-name="rowClassName"
-          :row-style="rowStyle"
-          :highlight="highlightCurrentRow"
-          :style="{
-            width: bodyWidth
-          }">
-        </table-body>
-      </div>
-      <div
-        v-if="showSummary"
-        v-show="data && data.length > 0"
-        class="el-table__fixed-footer-wrapper"
-        ref="rightFixedFooterWrapper">
-        <table-footer
-          fixed="right"
-          :border="border"
-          :sum-text="sumText || t('el.table.sumText')"
-          :summary-method="summaryMethod"
-          :store="store"
-          :style="{
-            width: bodyWidth
-          }"></table-footer>
-      </div>
-    </div>
-    <div
-      v-if="rightFixedColumns.length > 0"
-      class="el-table__fixed-right-patch"
-      ref="rightFixedPatch"
-      :style="{
-        width: layout.scrollY ? layout.gutterWidth + 'px' : '0',
-        height: layout.headerHeight + 'px'
-      }"></div>
-    <div class="el-table__column-resize-proxy" ref="resizeProxy" v-show="resizeProxyVisible"></div>
-  </div>
-</template>
-
-<script type="text/babel">
-  import ElCheckbox from 'element-ui/packages/checkbox';
-  import debounce from 'throttle-debounce/debounce';
-  import { addResizeListener, removeResizeListener } from 'element-ui/src/utils/resize-event';
-  import Mousewheel from 'element-ui/src/directives/mousewheel';
-  import Locale from 'element-ui/src/mixins/locale';
-  import Migrating from 'element-ui/src/mixins/migrating';
-  import TableStore from './table-store';
-  import TableLayout from './table-layout';
-  import TableBody from './table-body';
-  import TableHeader from './table-header';
-  import TableFooter from './table-footer';
-
-  let tableIdSeed = 1;
-
-  export default {
-    name: 'ElTable',
-
-    mixins: [Locale, Migrating],
-
-    directives: {
-      Mousewheel
-    },
-
-    props: {
-      data: {
-        type: Array,
-        default: function() {
-          return [];
-        }
-      },
-
-      size: String,
-
-      width: [String, Number],
-
-      height: [String, Number],
-
-      maxHeight: [String, Number],
-
-      fit: {
-        type: Boolean,
-        default: true
-      },
-
-      stripe: Boolean,
-
-      border: Boolean,
-
-      dragColumn: [String, Boolean],
-
-      dragRow: [String, Boolean],
-
-      rowKey: [String, Function],
-
-      context: {},
-
-      showHeader: {
-        type: Boolean,
-        default: true
-      },
-
-      showSummary: Boolean,
-
-      sumText: String,
-
-      summaryMethod: Function,
-
-      rowClassName: [String, Function],
-
-      rowStyle: [Object, Function],
-
-      cellClassName: [String, Function],
-
-      cellStyle: [Object, Function],
-
-      headerRowClassName: [String, Function],
-
-      headerRowStyle: [Object, Function],
-
-      headerCellClassName: [String, Function],
-
-      headerCellStyle: [Object, Function],
-
-      highlightCurrentRow: Boolean,
-
-      currentRowKey: [String, Number],
-
-      emptyText: String,
-
-      expandRowKeys: Array,
-
-      defaultExpandAll: Boolean,
-
-      defaultSort: Object,
-
-      tooltipEffect: String,
-
-      spanMethod: Function,
-
-      selectOnIndeterminate: {
-        type: Boolean,
-        default: true
-      }
-    },
-
-    components: {
-      TableHeader,
-      TableFooter,
-      TableBody,
-      ElCheckbox
-    },
-
-    methods: {
-      getMigratingConfig() {
-        return {
-          events: {
-            expand: 'expand is renamed to expand-change'
-          }
-        };
-      },
-
-      setCurrentRow(row) {
-        this.store.commit('setCurrentRow', row);
-      },
-
-      toggleRowSelection(row, selected) {
-        this.store.toggleRowSelection(row, selected);
-        this.store.updateAllSelected();
-      },
-
-      toggleRowExpansion(row, expanded) {
-        this.store.toggleRowExpansion(row, expanded);
-      },
-
-      clearSelection() {
-        this.store.clearSelection();
-      },
-
-      clearFilter() {
-        this.store.clearFilter();
-      },
-
-      clearSort() {
-        this.store.clearSort();
-      },
-
-      handleMouseLeave() {
-        this.store.commit('setHoverRow', null);
-        if (this.hoverState) this.hoverState = null;
-      },
-
-      updateScrollY() {
-        this.layout.updateScrollY();
-        this.layout.updateColumnsWidth();
-      },
-
-      handleFixedMousewheel(event, data) {
-        const bodyWrapper = this.bodyWrapper;
-        if (Math.abs(data.spinY) > 0) {
-          const currentScrollTop = bodyWrapper.scrollTop;
-          if (data.pixelY < 0 && currentScrollTop !== 0) {
-            event.preventDefault();
-          }
-          if (data.pixelY > 0 && bodyWrapper.scrollHeight - bodyWrapper.clientHeight > currentScrollTop) {
-            event.preventDefault();
-          }
-          bodyWrapper.scrollTop += Math.ceil(data.pixelY / 5);
-        } else {
-          bodyWrapper.scrollLeft += Math.ceil(data.pixelX / 5);
-        }
-      },
-
-      handleHeaderFooterMousewheel(event, data) {
-        const { pixelX, pixelY } = data;
-        if (Math.abs(pixelX) >= Math.abs(pixelY)) {
-          event.preventDefault();
-          this.bodyWrapper.scrollLeft += data.pixelX / 5;
-        }
-      },
-
-      bindEvents() {
-        const { headerWrapper, footerWrapper } = this.$refs;
-        const refs = this.$refs;
-        let self = this;
-
-        this.bodyWrapper.addEventListener('scroll', function() {
-          if (headerWrapper) headerWrapper.scrollLeft = this.scrollLeft;
-          if (footerWrapper) footerWrapper.scrollLeft = this.scrollLeft;
-          if (refs.fixedBodyWrapper) refs.fixedBodyWrapper.scrollTop = this.scrollTop;
-          if (refs.rightFixedBodyWrapper) refs.rightFixedBodyWrapper.scrollTop = this.scrollTop;
-          const maxScrollLeftPosition = this.scrollWidth - this.offsetWidth - 1;
-          const scrollLeft = this.scrollLeft;
-          if (scrollLeft >= maxScrollLeftPosition) {
-            self.scrollPosition = 'right';
-          } else if (scrollLeft === 0) {
-            self.scrollPosition = 'left';
-          } else {
-            self.scrollPosition = 'middle';
-          }
-        });
-
-        if (this.fit) {
-          addResizeListener(this.$el, this.resizeListener);
-        }
-      },
-
-      resizeListener() {
-        if (!this.$ready) return;
-        let shouldUpdateLayout = false;
-        const el = this.$el;
-        const { width: oldWidth, height: oldHeight } = this.resizeState;
-
-        const width = el.offsetWidth;
-        if (oldWidth !== width) {
-          shouldUpdateLayout = true;
-        }
-
-        const height = el.offsetHeight;
-        if ((this.height || this.shouldUpdateHeight) && oldHeight !== height) {
-          shouldUpdateLayout = true;
-        }
-
-        if (shouldUpdateLayout) {
-          this.resizeState.width = width;
-          this.resizeState.height = height;
-          this.doLayout();
-        }
-      },
-
-      doLayout() {
-        this.layout.updateColumnsWidth();
-        if (this.shouldUpdateHeight) {
-          this.layout.updateElsHeight();
-        }
-      },
-
-      sort(prop, order) {
-        this.store.commit('sort', { prop, order });
-      }
-    },
-
-    created() {
-      this.tableId = 'el-table_' + tableIdSeed++;
-      this.debouncedUpdateLayout = debounce(50, () => this.doLayout());
-    },
-
-    computed: {
-      tableSize() {
-        return this.size || (this.$ELEMENT || {}).size;
-      },
-
-      bodyWrapper() {
-        return this.$refs.bodyWrapper;
-      },
-
-      shouldUpdateHeight() {
-        return this.height ||
-          this.maxHeight ||
-          this.fixedColumns.length > 0 ||
-          this.rightFixedColumns.length > 0;
-      },
-
-      selection() {
-        return this.store.states.selection;
-      },
-
-      columns() {
-        return this.store.states.columns;
-      },
-
-      tableData() {
-        return this.store.states.data;
-      },
-
-      fixedColumns() {
-        return this.store.states.fixedColumns;
-      },
-
-      rightFixedColumns() {
-        return this.store.states.rightFixedColumns;
-      },
-
-      bodyWidth() {
-        const { bodyWidth, scrollY, gutterWidth } = this.layout;
-        return bodyWidth ? bodyWidth - (scrollY ? gutterWidth : 0) + 'px' : '';
-      },
-
-      bodyHeight() {
-        if (this.height) {
-          return {
-            height: this.layout.bodyHeight ? this.layout.bodyHeight + 'px' : ''
-          };
-        } else if (this.maxHeight) {
-          return {
-            'max-height': (this.showHeader
-              ? this.maxHeight - this.layout.headerHeight - this.layout.footerHeight
-              : this.maxHeight - this.layout.footerHeight) + 'px'
-          };
-        }
-        return {};
-      },
-
-      fixedBodyHeight() {
-        if (this.height) {
-          return {
-            height: this.layout.fixedBodyHeight ? this.layout.fixedBodyHeight + 'px' : ''
-          };
-        } else if (this.maxHeight) {
-          let maxHeight = this.layout.scrollX ? this.maxHeight - this.layout.gutterWidth : this.maxHeight;
-
-          if (this.showHeader) {
-            maxHeight -= this.layout.headerHeight;
-          }
-
-          maxHeight -= this.layout.footerHeight;
-
-          return {
-            'max-height': maxHeight + 'px'
-          };
-        }
-
-        return {};
-      },
-
-      fixedHeight() {
-        if (this.maxHeight) {
-          if (this.showSummary) {
-            return {
-              bottom: 0
-            };
-          }
-          return {
-            bottom: (this.layout.scrollX && this.data.length) ? this.layout.gutterWidth + 'px' : ''
-          };
-        } else {
-          if (this.showSummary) {
-            return {
-              height: this.layout.tableHeight ? this.layout.tableHeight + 'px' : ''
-            };
-          }
-          return {
-            height: this.layout.viewportHeight ? this.layout.viewportHeight + 'px' : ''
-          };
-        }
-      }
-    },
-
-    watch: {
-      height: {
-        immediate: true,
-        handler(value) {
-          this.layout.setHeight(value);
-        }
-      },
-
-      maxHeight: {
-        immediate: true,
-        handler(value) {
-          this.layout.setMaxHeight(value);
-        }
-      },
-
-      currentRowKey(newVal) {
-        this.store.setCurrentRowKey(newVal);
-      },
-
-      data: {
-        immediate: true,
-        handler(value) {
-          this.store.commit('setData', value);
-          if (this.$ready) {
-            this.$nextTick(() => {
-              this.doLayout();
-            });
-          }
-        }
-      },
-
-      expandRowKeys: {
-        immediate: true,
-        handler(newVal) {
-          if (newVal) {
-            this.store.setExpandRowKeys(newVal);
-          }
-        }
-      }
-    },
-
-    destroyed() {
-      if (this.resizeListener) removeResizeListener(this.$el, this.resizeListener);
-    },
-
-    mounted() {
-      this.bindEvents();
-      this.store.updateColumns();
-      this.doLayout();
-
-      this.resizeState = {
-        width: this.$el.offsetWidth,
-        height: this.$el.offsetHeight
-      };
-
-      // init filters
-      this.store.states.columns.forEach(column => {
-        if (column.filteredValue && column.filteredValue.length) {
-          this.store.commit('filterChange', {
-            column,
-            values: column.filteredValue,
-            silent: true
-          });
-        }
-      });
-
-      this.$ready = true;
-    },
-
-    data() {
-      const store = new TableStore(this, {
-        rowKey: this.rowKey,
-        defaultExpandAll: this.defaultExpandAll,
-        selectOnIndeterminate: this.selectOnIndeterminate
-      });
-      const layout = new TableLayout({
-        store,
-        table: this,
-        fit: this.fit,
-        showHeader: this.showHeader
-      });
-      return {
-        layout,
-        store,
-        isHidden: false,
-        renderExpanded: null,
-        resizeProxyVisible: false,
-        resizeState: {
-          width: null,
-          height: null
-        },
-        // 是否拥有多级表头
-        isGroup: false,
-        scrollPosition: 'left'
-      };
-    }
-  };
-</script>

src/lib/el-table/src/util.js

@@ -1,110 +0,0 @@
-import { getValueByPath } from 'element-ui/src/utils/util';
-
-export const getCell = function(event) {
-  let cell = event.target;
-
-  while (cell && cell.tagName.toUpperCase() !== 'HTML') {
-    if (cell.tagName.toUpperCase() === 'TD') {
-      return cell;
-    }
-    cell = cell.parentNode;
-  }
-
-  return null;
-};
-
-const isObject = function(obj) {
-  return obj !== null && typeof obj === 'object';
-};
-
-export const orderBy = function(array, sortKey, reverse, sortMethod, sortBy) {
-  if (!sortKey && !sortMethod && (!sortBy || Array.isArray(sortBy) && !sortBy.length)) {
-    return array;
-  }
-  if (typeof reverse === 'string') {
-    reverse = reverse === 'descending' ? -1 : 1;
-  } else {
-    reverse = (reverse && reverse < 0) ? -1 : 1;
-  }
-  const getKey = sortMethod ? null : function(value, index) {
-    if (sortBy) {
-      if (!Array.isArray(sortBy)) {
-        sortBy = [sortBy];
-      }
-      return sortBy.map(function(by) {
-        if (typeof by === 'string') {
-          return getValueByPath(value, by);
-        } else {
-          return by(value, index, array);
-        }
-      });
-    }
-    if (sortKey !== '$key') {
-      if (isObject(value) && '$value' in value) value = value.$value;
-    }
-    return [isObject(value) ? getValueByPath(value, sortKey) : value];
-  };
-  const compare = function(a, b) {
-    if (sortMethod) {
-      return sortMethod(a.value, b.value);
-    }
-    for (let i = 0, len = a.key.length; i < len; i++) {
-      if (a.key[i] < b.key[i]) {
-        return -1;
-      }
-      if (a.key[i] > b.key[i]) {
-        return 1;
-      }
-    }
-    return 0;
-  };
-  return array.map(function(value, index) {
-    return {
-      value: value,
-      index: index,
-      key: getKey ? getKey(value, index) : null
-    };
-  }).sort(function(a, b) {
-    let order = compare(a, b);
-    if (!order) {
-      // make stable https://en.wikipedia.org/wiki/Sorting_algorithm#Stability
-      order = a.index - b.index;
-    }
-    return order * reverse;
-  }).map(item => item.value);
-};
-
-export const getColumnById = function(table, columnId) {
-  let column = null;
-  table.columns.forEach(function(item) {
-    if (item.id === columnId) {
-      column = item;
-    }
-  });
-  return column;
-};
-
-export const getColumnByCell = function(table, cell) {
-  const matches = (cell.className || '').match(/el-table_[^\s]+/gm);
-  if (matches) {
-    return getColumnById(table, matches[0]);
-  }
-  return null;
-};
-
-export const getRowIdentity = (row, rowKey) => {
-  if (!row) throw new Error('row is required when get row identity');
-  if (typeof rowKey === 'string') {
-    if (rowKey.indexOf('.') < 0) {
-      return row[rowKey];
-    }
-    let key = rowKey.split('.');
-    let current = row;
-    for (let i = 0; i < key.length; i++) {
-      current = current[key[i]];
-    }
-    return current;
-  } else if (typeof rowKey === 'function') {
-    return rowKey.call(null, row);
-  }
-};

src/views/TMS/components/importedIngredients/truckEnfactoryFuResult.vue

@@ -11,7 +11,7 @@
         <i class="el-icon-search"></i>查询
       </el-button>
     </div>
-    <dilTable v-bind.sync="option">
+    <dilTable v-bind.sync="option" id="TMS_trunkEnfactoryFuResult_faTable" individual-panel>
       
     </dilTable>
   </div>
@@ -23,6 +23,23 @@ export default {
   name: "homeworkPath",
   data() {
     return {
+      tableData: [{
+            date: '2016-05-02',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1518 弄'
+          }, {
+            date: '2016-05-04',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1517 弄'
+          }, {
+            date: '2016-05-01',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1519 弄'
+          }, {
+            date: '2016-05-03',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1516 弄'
+          }],
       restaurants: [],
       startTime: null,
       endTime: null,
@@ -33,7 +50,9 @@ export default {
       },
     };
   },
-
+  mounted(){
+    console.log('this', this);
+  },
   methods: {
     onclick() {
       let startTime = null;

src/views/TMS/components/importedMine/addWagonLoad.vue

@@ -516,6 +516,7 @@ export default {
             temp.sendDate=row.sendDate;
             temp.arrivalDate=row.arrivalDate;
             temp.groupNo=row.groupNo;
+
             tableData.push(temp);
           }
         });

src/views/appoint/components/saleContract/saleOrderSteel.vue

@@ -33,13 +33,21 @@
           </el-button>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" @click="btnclick(0)">
+          <el-button
+            type="primary"
+            @click="btnclick(0)"
+            v-if="activeName == 'first'"
+          >
             <i class="el-icon-plus"></i>新增
           </el-button>
           <el-button type="primary" @click="refresh">
             <i class="el-icon-refresh"></i>
           </el-button>
-          <el-button type="primary" @click="batchReport">
+          <el-button
+            type="primary"
+            @click="batchReport"
+            v-if="activeName == 'first'"
+          >
             <i class="upload2"></i>批量上传
           </el-button>
           <el-button
@@ -62,13 +70,32 @@
               >
             </el-upload>
           </el-form-item>
-          <el-button disabled>物资总件数</el-button>
+          <el-button disabled v-if="activeName != 'five'">物资总件数</el-button>
           <el-input
             placeholder=""
             v-model="matSum"
             clearable
             style="width:100px"
             disabled
+            v-show="activeName == 'first'"
+          >
+          </el-input>
+          <el-input
+            placeholder=""
+            v-model="matSum1"
+            clearable
+            style="width:100px"
+            disabled
+            v-show="activeName == 'four'"
+          >
+          </el-input>
+          <el-input
+            placeholder=""
+            v-model="matSum2"
+            clearable
+            style="width:100px"
+            disabled
+            v-show="activeName == 'second'"
           >
           </el-input>
         </el-form-item>
@@ -164,12 +191,7 @@
           </mergeRowTable>
         </el-tab-pane>
         <el-tab-pane label="反审批" name="five">
-          <mergeRowTable
-            v-bind.sync="option5"
-            ref="table2"
-            :pageSize="200"
-            @func="func3"
-          >
+          <mergeRowTable v-bind.sync="option5" ref="table2" :pageSize="200">
             <el-table-column
               fixed="right"
               label="操作"
@@ -317,6 +339,8 @@ export default {
       mapList: [],
       mapItemList: [],
       matSum: null,
+      matSum1: null,
+      matSum2: null,
       tableData: [],
       saleDateOfReceipt: null,
       //销售订单主表数据
@@ -496,11 +520,9 @@ export default {
         let rows = XLSX.utils.sheet_to_json(
           workbook.Sheets[workbook.SheetNames[0]]
         ) //只取第一页
-        console.log('rows', rows)
         Array.from(rows).forEach((e, index) => {
           let map = {}
           try {
-            debugger
             Object.keys(e).forEach(e1 => {
               if (e1.includes('销售订单编号')) {
                 map.saleOrderNo = e[e1]
@@ -597,12 +619,12 @@ export default {
                 map.salerName = e[e1]
               }
               if (e1.includes('摘要')) {
-                if (e[e1].includes('范围定尺')) {
-                  map.saleRemark = e[e1]
-                } else {
-                  map.saleRemark = e[e1]
+                if (e[e1]) {
+                  let regex = /,定尺范围.*米|,范围定尺.*米/g
+                  console.log(e[e1])
+                  map.saleRemark = e[e1].replace(/,|，/g, ',').split(regex)[0]
                 }
-                map.saleRemark = e[e1]
+                console.log(e[e1])
                 let regex = /钢材.*组/g
                 if (e[e1].match(regex)) {
                   map.saleArea = e[e1].match(regex)[0]
@@ -647,11 +669,10 @@ export default {
             if (map.saleRemark && map.receiveName && map.materialName) {
               that.tableData.push(map)
             }
-          } catch (e) {
-            that.$message.error(e.message)
+          } catch (es) {
+            that.$message.error(es.message)
           }
         })
-        console.log(this.tableData)
         that.addExcelInport()
         // that.dialogTableVisible = true;
         return
@@ -675,8 +696,6 @@ export default {
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
-      console.log(this.tableData)
-      debugger
       //遍历数组,根据摘要和下单客户自动给出销售订单编号
       for (let i = 0; i < this.tableData.length; i++) {
         if (i === 0) {
@@ -730,14 +749,11 @@ export default {
       }, {})
       // result即为所求
       let result = Object.values(map1)
-      console.log(result)
       //遍历数组
       let saleOrderListMap = []
       result.forEach((saleOrderList, index) => {
         let map = {}
         let arr = []
-        console.log('saleOrderList')
-        console.log(saleOrderList)
         saleOrderList.forEach(e => {
           let mapMaterial = {}
           Object.keys(e).forEach(e1 => {
@@ -755,7 +771,6 @@ export default {
         map.mapList = arr
         saleOrderListMap.push(map)
       })
-      console.log(saleOrderListMap)
       this.axios
         .post('/api/v1/ams/addSteelSaleOrderList', saleOrderListMap)
         .then(res => {
@@ -837,22 +852,20 @@ export default {
         })
     },
     func(res) {
+      console.log('func', res)
       this.matSum = res.list.reduce(function(prev, item) {
         return prev + item.materialNumber
       }, 0)
     },
     func1(res) {
-      this.matSum = res.list.reduce(function(prev, item) {
+      console.log('func1', res)
+      this.matSum1 = res.list.reduce(function(prev, item) {
         return prev + item.materialNumber
       }, 0)
+      console.log(this.matSum, 'matsum')
     },
     func2(res) {
-      this.matSum = res.list.reduce(function(prev, item) {
-        return prev + item.materialNumber
-      }, 0)
-    },
-    func3(res) {
-      this.matSum = res.list.reduce(function(prev, item) {
+      this.matSum2 = res.list.reduce(function(prev, item) {
         return prev + item.materialNumber
       }, 0)
     },

src/views/index/app.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-    <meta name="full-screen" content="webkit">
+    <meta name="renderer" content="webkit">
     <meta content="智慧物流平台" name="keywords">
     <meta content="智慧物流平台" name="description">
     <title>登录 - 智慧物流平台</title>

src/views/index/components/login.vue

@@ -57,11 +57,11 @@
   </div>
 </template>
 <script>
-import { cookieUserId, cookieTime, cookieUserName } from "@/config/config.js";
-import { setCookie, getCookie, formatDate } from "@/utils/util.js";
-import store from "@/store/index.js";
-import JsSHA from "jssha";
-const shaObj = new JsSHA("SHA-1", "TEXT", { encoding: "UTF8" });
+import { cookieUserId, cookieTime, cookieUserName } from '@/config/config.js'
+import { setCookie, getCookie, formatDate } from '@/utils/util.js'
+import store from '@/store/index.js'
+import JsSHA from 'jssha'
+const shaObj = new JsSHA('SHA-1', 'TEXT', { encoding: 'UTF8' })
 export default {
   data() {
     return {
@@ -70,152 +70,152 @@ export default {
       pwdShow: false,
       shaObj,
       loginForm: {
-        loginName: "",
-        password: ""
+        loginName: '',
+        password: ''
       },
       loginFormRules: {
         loginName: [
-          { required: true, message: "请输入用户名", trigger: "blur" }
+          { required: true, message: '请输入用户名', trigger: 'blur' }
         ],
-        password: [{ required: true, message: "请输入密码", trigger: "blur" }]
+        password: [{ required: true, message: '请输入密码', trigger: 'blur' }]
       },
       isJump: false
-    };
+    }
   },
   beforeCreate() {
-    let token = getCookie("accessToken");
+    let token = getCookie('accessToken')
     if (token) {
-      this.$router.push({ path: "default" });
+      this.$router.push({ path: 'default' })
     } else {
-      window.top.localStorage.setItem("lockpwd", "");
+      window.top.localStorage.setItem('lockpwd', '')
     }
-    window.top.localStorage.setItem("allPrivilege", "");
-    window.top.localStorage.setItem("ownPrivilege", "");
+    window.top.localStorage.setItem('allPrivilege', '')
+    window.top.localStorage.setItem('ownPrivilege', '')
   },
   mounted() {
     // 从cookie中获取上一次的登录用户名，赋值给用户名
-    this.loginForm.loginName = getCookie("loginName")
-      ? getCookie("loginName")
-      : "";
+    this.loginForm.loginName = getCookie('loginName')
+      ? getCookie('loginName')
+      : ''
   },
   methods: {
     loginSubmit(formName) {
-      this.loginForm.loginName = this.loginForm.loginName.trim();
+      this.loginForm.loginName = this.loginForm.loginName.trim()
       this.$refs[formName].validate(valid => {
         if (valid) {
           // 登陆中 登录按钮不可用
-          this.loginBtnLoading = true;
-          let form = JSON.parse(JSON.stringify(this.loginForm));
-          form.app_code = "web"; //终端code暂时写死
-          this.shaObj.update(form.password);
-          console.log(form.password);
-
-          form.password = this.shaObj.getHash("HEX");
-          console.log(form.password);
+          this.loginBtnLoading = true
+          let form = JSON.parse(JSON.stringify(this.loginForm))
+          form.app_code = 'web' //终端code暂时写死
+          this.shaObj.update(form.password)
+          console.log(form.password)
+          form.password = this.shaObj.getHash('HEX')
+          console.log(form.password)
           this.store
-            .dispatch("index/login/login", form)
+            .dispatch('index/login/login', form)
             .then(res => {
-              if (res.code === "0") {
-                console.log(res, "res");
+              if (res.code === '0') {
+                console.log('login resonse', res.data)
                 //  登录成功
                 //  设置缓存信息
-                setCookie("accessToken", res.data.accessToken, cookieTime, "/");
+                setCookie('accessToken', res.data.accessToken, cookieTime, '/')
                 setCookie(
-                  "refreshToken",
+                  'refreshToken',
                   res.data.refreshToken,
                   cookieTime,
-                  "/"
-                );
-                setCookie("orgCode", res.data.user.orgCode);
-                setCookie("userId", res.data.user.userId);
-                setCookie("appId", res.data.appId);
-                setCookie("loginId", res.data.user.userId); // 为配合bms取值添加
-                setCookie("loginName", this.loginForm.loginName);
-                let info = JSON.parse(JSON.stringify(res.data.user));
+                  '/'
+                )
+                setCookie('orgCode', res.data.user.orgCode)
+                setCookie('userId', res.data.user.userId)
+                setCookie('appId', res.data.appId)
+                setCookie('loginId', res.data.user.userId) // 为配合bms取值添加
+                setCookie('loginName', this.loginForm.loginName)
+                let info = JSON.parse(JSON.stringify(res.data.user))
                 for (let k in info) {
+                  console.log('k,', k)
                   if (
-                    k === "sysGroup" ||
-                    k === "sysCompanys" ||
-                    k === "sysRoles" ||
-                    k === "photo"
+                    k === 'sysGroup' ||
+                    k === 'sysCompanys' ||
+                    k === 'sysRoles' ||
+                    k === 'photo' ||
+                    k === 'sysOrgs'
                   ) {
-                    delete info[k];
+                    delete info[k]
                   }
                 }
-                setCookie("userInfo", JSON.stringify(info));
+                console.log('info', JSON.stringify(info))
+                setCookie('userInfo', JSON.stringify(info))
                 // 判断用户集团公司情况跳转
-                let userInfo = res.data.user;
-                let sRedirect = this.$route.query.redirect;
-                console.log(userInfo);
-                console.log("userInfo");
+                let userInfo = res.data.user
+                let sRedirect = this.$route.query.redirect
+                console.log(userInfo)
+                console.log('userInfo')
                 // 超级管理员
-                if (userInfo.userCode === "admin") {
+                if (userInfo.userCode === 'admin') {
                   if (userInfo.sysCompanys) {
                     // 公司列表过多时cookie存放失败，存至localStorage
                     // setCookie('companys', JSON.stringify(userInfo.sysCompanys));
                     window.top.localStorage.setItem(
-                      "sysGroup",
+                      'sysGroup',
                       JSON.stringify(userInfo.sysGroup)
-                    );
+                    )
                     window.top.localStorage.setItem(
-                      "companys",
+                      'companys',
                       JSON.stringify(userInfo.sysCompanys)
-                    );
-                    if (userInfo.hasOwnProperty("sysCompanys")) {
+                    )
+                    if (userInfo.hasOwnProperty('sysCompanys')) {
                       window.top.localStorage.setItem(
-                        "companyId",
+                        'companyId',
                         userInfo.sysCompanys[0].id
-                      );
+                      )
                     }
                   }
                   if (sRedirect) {
-                    this.$router.push({ name: sRedirect });
+                    this.$router.push({ name: sRedirect })
                   } else {
-                    this.$router.push({ name: "default" }).catch(() => {});
+                    this.$router.push({ name: 'default' }).catch(() => {})
                   }
                   // 普通用户
                 } else {
                   if (
-                    userInfo.hasOwnProperty("sysGroup") &&
-                    userInfo.sysGroup !== "" &&
+                    userInfo.hasOwnProperty('sysGroup') &&
+                    userInfo.sysGroup !== '' &&
                     userInfo.sysGroup !== null &&
-                    JSON.stringify(userInfo.sysGroup) !== "{}" &&
-                    JSON.stringify(userInfo.sysGroup) !== "[]"
+                    JSON.stringify(userInfo.sysGroup) !== '{}' &&
+                    JSON.stringify(userInfo.sysGroup) !== '[]'
                   ) {
                     window.top.localStorage.setItem(
-                      "sysGroup",
+                      'sysGroup',
                       JSON.stringify(userInfo.sysGroup)
-                    );
-                    if (userInfo.hasOwnProperty("sysCompanys")) {
+                    )
+                    if (userInfo.hasOwnProperty('sysCompanys')) {
                       window.top.localStorage.setItem(
-                        "companys",
+                        'companys',
                         JSON.stringify(userInfo.sysCompanys)
-                      );
+                      )
                       window.top.localStorage.setItem(
-                        "companyId",
+                        'companyId',
                         userInfo.sysCompanys[0].id
-                      );
+                      )
                       if (userInfo.sysCompanys.length > 1) {
                         // 跳转选择集团公司页面
-                        this.$router.push({ name: "selectCompany" });
+                        this.$router.push({ name: 'selectCompany' })
                       } else {
                         if (sRedirect) {
-                          this.$router.push({ name: sRedirect });
+                          this.$router.push({ name: sRedirect })
                         } else {
-                          this.$router
-                            .push({ name: "default" })
-                            .catch(() => {});
+                          this.$router.push({ name: 'default' }).catch(() => {})
                         }
                       }
                     } else {
                       this.$message.error(
-                        "后台返回数据缺少company信息，请联系开发人员！"
-                      );
+                        '后台返回数据缺少company信息，请联系开发人员！'
+                      )
                     }
                   } else {
                     this.$message.error(
-                      "必须隶属一个集团！请先联系管理员添加集团信息!"
-                    );
+                      '必须隶属一个集团！请先联系管理员添加集团信息!'
+                    )
                   }
                 }
               } else {
@@ -223,27 +223,27 @@ export default {
                 // 提示
                 this.$message({
                   message: res.message,
-                  type: "error"
-                });
+                  type: 'error'
+                })
               }
-              this.loginBtnLoading = false;
-              setTimeout(() => {
-                this.$router.go(0);
-              }, 2000);
+              this.loginBtnLoading = false
+              // setTimeout(() => {
+              //   this.$router.go(0);
+              // }, 2000);
             })
             .catch(() => {
-              this.loginBtnLoading = false;
-            });
+              this.loginBtnLoading = false
+            })
         } else {
-          return false;
+          return false
         }
-      });
+      })
     },
     showPwd() {
-      this.pwdShow = !this.pwdShow;
+      this.pwdShow = !this.pwdShow
     }
   }
-};
+}
 </script>
 
 <style lang="less" scoped>

src/views/inward/components/offsetSteel/saleSteelTruckOrder/kucunList.vue

@@ -123,6 +123,8 @@
         :cell-style="{ fontWeight: '700' }"
         class="table"
         :span-method="objectSpanMethod"
+        id="offsetSteel_kucunList_Table"
+        individual-panel
         @selection-change="
           handleSelectionChange();
           handleMulSendChange();

src/views/queue/components/qmsEnFacotory/queueFStart.vue

@@ -116,7 +116,7 @@
             @selection-change="handleSelectionChange"
             max-height="600px"
           >
-          <!-- 是否可以勾选:selectable="selectInit" -->
+            <!-- 是否可以勾选:selectable="selectInit" -->
             <el-table-column
               type="selection"
               width="55"
@@ -139,8 +139,11 @@
             </el-table-column>
             <el-table-column label="装货点" width="100">
               <template slot-scope="scope">
-                <el-select size="mini" v-model="scope.row.id"
-                @change="changePriority(scope.row)">
+                <el-select
+                  size="mini"
+                  v-model="scope.row.id"
+                  @change="changePriority(scope.row)"
+                >
                   <el-option
                     v-for="item in option"
                     :key="item.id"
@@ -190,6 +193,8 @@
             <el-table-column type="selection" width="55"></el-table-column>
             <el-table-column prop="capacityNumber" label="车牌号" fit>
             </el-table-column>
+            <el-table-column prop="resultStartTime" label="排队开始时间">
+            </el-table-column>
             <el-table-column prop="consigneeName" label="客户" fit>
             </el-table-column>
             <el-table-column prop="materialName" label="物资名称">
@@ -202,8 +207,11 @@
             </el-table-column>
             <el-table-column label="装货点" width="100">
               <template slot-scope="scope">
-                <el-select size="mini" v-model="scope.row.id"
-                           @change="changePriority(scope.row)">
+                <el-select
+                  size="mini"
+                  v-model="scope.row.id"
+                  @change="changePriority(scope.row)"
+                >
                   <el-option
                     v-for="item in option"
                     :key="item.id"
@@ -215,8 +223,7 @@
               </template>
             </el-table-column>
             <el-table-column prop="grid" label="拼数" fit> </el-table-column>
-            <el-table-column prop="resultStartTime" label="排队开始时间">
-            </el-table-column>
+
             <el-table-column
               prop="listNodeOrder"
               label="序号"
@@ -251,7 +258,11 @@
             style="width: 100%; margin-top: 20px"
             max-height="500px"
           >
-            <el-table-column prop="warehouseName" label="仓库" fit></el-table-column>
+            <el-table-column
+              prop="warehouseName"
+              label="仓库"
+              fit
+            ></el-table-column>
             <el-table-column prop="carQueue" label="排队车辆"></el-table-column>
           </el-table>
         </el-tab-pane>
@@ -260,24 +271,24 @@
   </div>
 </template>
 <script>
-import { getCookie } from "@/utils/util.js";
+import { getCookie } from '@/utils/util.js'
 export default {
   data() {
     return {
-      capacityNo: "",
-      inputText: "",
+      capacityNo: '',
+      inputText: '',
       option1: {
         // 表格请求数据的地址
-        requestUrl: "",
-        selectionType: "select"
+        requestUrl: '',
+        selectionType: 'select'
       },
       optionMa: {
         // 表格请求数据的地址
-        requestUrl: "",
+        requestUrl: '',
         // 控制显示多选列
-        selectionType: "select"
+        selectionType: 'select'
       },
-      activeName: "first",
+      activeName: 'first',
       tableData: [],
       tableData1: [],
       tableData3: [],
@@ -303,30 +314,30 @@ export default {
       totalQueueNumFirst: null,
       //厂内钢材车辆总数
       steelOrderNum: 0
-    };
+    }
   },
   mounted() {
-    this.i = 0;
-    this.infomation();
-    this.getSpellingArray();
-    this.getNoSpellingArray();
-    this.getStoreArray();
-    this.getSteelOrderNum();
-    this.wantEnfactory();
-    this.start();
+    this.i = 0
+    this.infomation()
+    this.getSpellingArray()
+    this.getNoSpellingArray()
+    this.getStoreArray()
+    this.getSteelOrderNum()
+    this.wantEnfactory()
+    this.start()
   },
   computed: {
     wantS() {
-      return this.totalQueueNum;
+      return this.totalQueueNum
     }
   },
   beforeDestroy() {
-    this.timer;
+    this.timer
   },
   watch: {
     wantS() {
       if (this.totalQueueNum - this.totalQueueNumFirst > 0) {
-        this.redDotNum = this.totalQueueNum - this.totalQueueNumFirst;
+        this.redDotNum = this.totalQueueNum - this.totalQueueNumFirst
       }
     }
   },
@@ -335,145 +346,145 @@ export default {
       let map = {
         listId: scope.row.listId,
         resultTotalId: scope.row.resultTotalId
-      };
-      console.log(map);
-      this.axios.post("/api/v1/qms/ctrlZQueueAllow", map).then(res => {
+      }
+      console.log(map)
+      this.axios.post('/api/v1/qms/ctrlZQueueAllow', map).then(res => {
         if (res.data.code == 200) {
-          this.$message.success("撤销成功");
-          this.getNoSpellingArray();
-          this.getSpellingArray();
+          this.$message.success('撤销成功')
+          this.getNoSpellingArray()
+          this.getSpellingArray()
         } else {
-          this.$message.error("撤单失败");
+          this.$message.error('撤单失败')
         }
-      });
+      })
     },
     wantEnfactory() {
-      this.axios.get("/api/v1/uc/getQueueCount").then(res => {
-        this.totalQueueNum = res.data.data;
-        console.log(this.totalQueueNum, "totalQueueNum");
+      this.axios.get('/api/v1/uc/getQueueCount').then(res => {
+        this.totalQueueNum = res.data.data
+        console.log(this.totalQueueNum, 'totalQueueNum')
         if (this.i == 0) {
-          this.totalQueueNumFirst = this.totalQueueNum;
+          this.totalQueueNumFirst = this.totalQueueNum
         }
-        this.i++;
-      });
+        this.i++
+      })
     },
     start() {
-      this.timer = setInterval(this.wantEnfactory, 60000);
+      this.timer = setInterval(this.wantEnfactory, 60000)
     },
     refresh() {
-      this.getSpellingArray();
-      this.getNoSpellingArray();
-      this.getSteelOrderNum();
-      this.getStoreArray();
-      this.redDotNum = null;
-      this.totalQueueNum = null;
-      this.totalQueueNumFirst = null;
-      this.i = 0;
-      clearInterval(this.timer);
-      this.start();
+      this.getSpellingArray()
+      this.getNoSpellingArray()
+      this.getSteelOrderNum()
+      this.getStoreArray()
+      this.redDotNum = null
+      this.totalQueueNum = null
+      this.totalQueueNumFirst = null
+      this.i = 0
+      clearInterval(this.timer)
+      this.start()
     },
     getSteelOrderNum() {
-      this.axios.get("/api/v1/uc/getSteelOrderNum").then(res => {
-        this.steelOrderNum = res.data.data;
-      });
+      this.axios.get('/api/v1/uc/getSteelOrderNum').then(res => {
+        this.steelOrderNum = res.data.data
+      })
     },
     getRowKey(row) {
-      return row.ROW_ID;
+      return row.ROW_ID
     },
     selectInit(row) {
       if (this.maplist.length == 0) {
         if (row.ROW_ID == 1) {
-          return true;
+          return true
         } else {
-          return false;
+          return false
         }
       } else {
         if (
           this.maplist.some(e => {
-            return e.ROW_ID == row.ROW_ID || e.ROW_ID + 1 == row.ROW_ID;
+            return e.ROW_ID == row.ROW_ID || e.ROW_ID + 1 == row.ROW_ID
           })
         ) {
-          return true;
+          return true
         } else {
-          return false;
+          return false
         }
       }
     },
     rowDbClick(row) {
-      this.materialList = [];
-      this.materialList.push(row);
-      this.makeSureMaterial();
+      this.materialList = []
+      this.materialList.push(row)
+      this.makeSureMaterial()
     },
     //物资模态框查询
     onclickMaterial1() {
       this.optionMa.requestUrl =
-        "/api/v1/uc/getSteelMaterial?apiId=244&materialNameText=" +
+        '/api/v1/uc/getSteelMaterial?apiId=244&materialNameText=' +
         this.materialNameText +
-        "&materialSpecificationText=" +
-        this.materialSpecificationText;
+        '&materialSpecificationText=' +
+        this.materialSpecificationText
     },
     onclickMaterial() {
-      this.table1 = true;
+      this.table1 = true
       this.optionMa.requestUrl =
-        "/api/v1/uc/getSteelMaterial?apiId=244&i=" + new Date();
+        '/api/v1/uc/getSteelMaterial?apiId=244&i=' + new Date()
     },
     //返回选中的物资信息
     selectionChange2(selection) {
-      this.materialList1 = [];
-      this.materialList1 = selection;
-      this.materialList = this.materialList.concat(this.materialList1);
+      this.materialList1 = []
+      this.materialList1 = selection
+      this.materialList = this.materialList.concat(this.materialList1)
     },
     makeSureMaterial() {
-      console.log(this.materialList);
-      var materialIdList = [];
+      console.log(this.materialList)
+      var materialIdList = []
       this.materialList.forEach(e => {
         if (materialIdList.indexOf(e.materialId) == -1) {
-          materialIdList.push(e.materialId);
+          materialIdList.push(e.materialId)
         }
-      });
+      })
       let map = {
         materialList: materialIdList
-      };
-      this.materialList = [];
-      this.materialList1 = [];
-      if (this.activeName == "first") {
+      }
+      this.materialList = []
+      this.materialList1 = []
+      if (this.activeName == 'first') {
         this.axios
-          .post("/api/v1/qms/getQueueListByQueueUp?isSpelling=0", map)
+          .post('/api/v1/qms/getQueueListByQueueUp?isSpelling=0', map)
           .then(res => {
-            this.tableData1 = res.data.data;
-          });
+            this.tableData1 = res.data.data
+          })
       } else {
         this.axios
-          .post("/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1", map)
+          .post('/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1', map)
           .then(res => {
-            this.tableData = res.data.data;
-            this.getSpanArr(this.tableData);
-          });
+            this.tableData = res.data.data
+            this.getSpanArr(this.tableData)
+          })
       }
-      this.table1 = false;
+      this.table1 = false
     },
     infomation() {
-      this.axios.get("/api/v1/uc/getSteelWarehouse").then(res => {
-        console.log(res.data);
-        this.option = res.data;
-      });
+      this.axios.get('/api/v1/uc/getSteelWarehouse').then(res => {
+        console.log(res.data)
+        this.option = res.data
+      })
     },
     //记录每一行的合并数
     getSpanArr(data) {
       //每次调用方法初始化
-      this.spanArr = [];
+      this.spanArr = []
       for (var i = 0; i < data.length; i++) {
         if (i === 0) {
-          this.spanArr.push(1);
-          this.pos = 0;
+          this.spanArr.push(1)
+          this.pos = 0
         } else {
           // 判断当前元素与上一个元素是否相同
           if (data[i].resultTotalId === data[i - 1].resultTotalId) {
-            this.spanArr[this.pos] += 1;
-            this.spanArr.push(0);
+            this.spanArr[this.pos] += 1
+            this.spanArr.push(0)
           } else {
-            this.spanArr.push(1);
-            this.pos = i;
+            this.spanArr.push(1)
+            this.pos = i
           }
         }
       }
@@ -483,7 +494,7 @@ export default {
         columnIndex === 0 ||
         columnIndex === 1 ||
         columnIndex === 2 ||
-        columnIndex === 8 ||
+        columnIndex === 3 ||
         columnIndex === 9 ||
         columnIndex === 10 ||
         columnIndex === 11 ||
@@ -491,91 +502,87 @@ export default {
         columnIndex === 13 ||
         columnIndex === 14
       ) {
-        const _row = this.spanArr[rowIndex];
-        const _col = _row > 0 ? 1 : 0;
+        const _row = this.spanArr[rowIndex]
+        const _col = _row > 0 ? 1 : 0
         return {
           rowspan: _row,
           colspan: _col
-        };
+        }
       }
     },
     handleClick() {
-      this.redDotNum = null;
-      this.totalQueueNum = null;
-      this.totalQueueNumFirst = null;
-      this.i = 0;
-      if (this.activeName == "first") {
-        this.getNoSpellingArray();
-      } else if(this.activeName == "second") {
-        this.getSpellingArray();
+      this.redDotNum = null
+      this.totalQueueNum = null
+      this.totalQueueNumFirst = null
+      this.i = 0
+      if (this.activeName == 'first') {
+        this.getNoSpellingArray()
+      } else if (this.activeName == 'second') {
+        this.getSpellingArray()
       } else {
-        this.getStoreArray();
+        this.getStoreArray()
       }
     },
     getNoSpellingArray() {
       this.axios
-        .post("/api/v1/qms/getQueueListByQueueUp?isSpelling=0&i=" + new Date())
+        .post('/api/v1/qms/getQueueListByQueueUp?isSpelling=0&i=' + new Date())
         .then(res => {
-          this.tableData1 = res.data.data;
-          console.log(this.tableData1);
-        });
+          this.tableData1 = res.data.data
+          console.log(this.tableData1)
+        })
     },
     getSpellingArray() {
       this.axios
         .post(
-          "/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1&i=" +
+          '/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1&i=' +
             new Date()
         )
         .then(res => {
-          this.tableData = res.data.data;
-          console.log(this.tableData);
-          this.getSpanArr(this.tableData);
-        });
+          this.tableData = res.data.data
+          console.log(this.tableData)
+          this.getSpanArr(this.tableData)
+        })
     },
     getStoreArray() {
-      this.axios
-        .post(
-          "/api/v1/qms/getStoreQueueList"
-        )
-        .then(res => {
-          this.tableData3 = res.data.data;
-          console.log("getStoreArray "+JSON.stringify(this.tableData3));
-        });
+      this.axios.post('/api/v1/qms/getStoreQueueList').then(res => {
+        this.tableData3 = res.data.data
+        console.log('getStoreArray ' + JSON.stringify(this.tableData3))
+      })
     },
     onclick() {
-      if (this.activeName == "first") {
+      if (this.activeName == 'first') {
         this.axios
           .post(
-            "/api/v1/qms/getQueueListByQueueUp?isSpelling=0&i=" +
+            '/api/v1/qms/getQueueListByQueueUp?isSpelling=0&i=' +
               new Date() +
-              "&capacityNumber=" +
+              '&capacityNumber=' +
               this.capacityNo
           )
           .then(res => {
-            this.tableData1 = res.data.data;
-          });
-        console.log("wzxxx");
+            this.tableData1 = res.data.data
+          })
+        console.log('wzxxx')
       } else {
         this.axios
           .post(
-            "/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1&i=" +
+            '/api/v1/qms/getQueueListByQueueUp?apiId=473&isSpelling=1&i=' +
               new Date() +
-              "&capacityNumber=" +
+              '&capacityNumber=' +
               this.capacityNo
           )
           .then(res => {
-            this.tableData = res.data.data;
-            this.getSpanArr(this.tableData);
-          });
+            this.tableData = res.data.data
+            this.getSpanArr(this.tableData)
+          })
       }
     },
     handleSelectionChange(selection) {
-      this.maplist = [];
-      this.maplist = selection;
+      this.maplist = []
+      this.maplist = selection
       for (let i = 0; i < this.maplist.length; i++) {
         if (i + 1 < this.maplist.length) {
           if (this.maplist[i].ROW_ID + 1 != this.maplist[i + 1].ROW_ID) {
-            this.$refs.mutiData.clearSelection();
+            this.$refs.mutiData.clearSelection()
           }
         }
       }
@@ -589,105 +596,106 @@ export default {
       // }
     },
     updateBill(scope) {
-      console.log(scope.row.capacityId);
+      console.log(scope.row.capacityId)
       this.$router.push(
         `/editBill/${scope.row.capacityId}/${scope.row.capacityNumber}`
-      );
+      )
     },
     filterArr(resultId) {
-      console.log("fdhjsaj");
+      console.log('fdhjsaj')
       this.filterArr1 = this.filterArr1.concat(
         this.tableData.filter(ele => ele.resultId == resultId)
-      );
+      )
     },
     allow() {
       if (this.maplist.length == 0) {
-        this.$message.error("请选择需要放行的车辆");
-        return;
+        this.$message.error('请选择需要放行的车辆')
+        return
       }
       for (let i = 0; i < this.maplist.length; i++) {
-        console.log(typeof this.maplist[i].id);
+        console.log(typeof this.maplist[i].id)
         if (
-          typeof this.maplist[i].id == "undefined" ||
+          typeof this.maplist[i].id == 'undefined' ||
           this.maplist[i].id == null ||
-          this.maplist[i].id == "null"
+          this.maplist[i].id == 'null'
         ) {
-          this.$message.error("请选择装货点");
-          return;
+          this.$message.error('请选择装货点')
+          return
         }
-        let warehouse=this.tableData3.find(value=>value.materialPriority===this.maplist[i].id);
-        console.log("warehouse",warehouse);
-        if(warehouse && warehouse.carQueue >= 10){
-          this.$message.error("该仓库已经有10辆车在排队，不允许放行！");
-          return;
+        let warehouse = this.tableData3.find(
+          value => value.materialPriority === this.maplist[i].id
+        )
+        console.log('warehouse', warehouse)
+        if (warehouse && warehouse.carQueue >= 10) {
+          this.$message.error('该仓库已经有10辆车在排队，不允许放行！')
+          return
         }
-        this.filterArr(this.maplist[i].resultId);
+        this.filterArr(this.maplist[i].resultId)
       }
-      var filterArr2 = [];
+      var filterArr2 = []
       this.filterArr1.forEach(e => {
         if (filterArr2.indexOf(e) === -1) {
-          filterArr2.push(e);
+          filterArr2.push(e)
         }
-      });
+      })
       let map = {
-        ssoId: getCookie("userId"),
+        ssoId: getCookie('userId'),
         mapList: filterArr2
-      };
-      if (this.activeName == "first") {
-        map.mapList = this.maplist;
       }
-      this.axios.post("/api/v1/qms/allowEnFactory", map).then(res => {
-        if (res.data.code == "200") {
-          this.$message.success("放行成功，等待进厂");
-          this.maplist = [];
-          this.$refs.mutiData.clearSelection();
-          this.getNoSpellingArray();
-          this.getSpellingArray();
-          this.getStoreArray();
-          this.redDotNum = null;
-          this.totalQueueNum = null;
-          this.totalQueueNumFirst = null;
-          this.i = 0;
-          clearInterval(this.timer);
-          this.start();
+      if (this.activeName == 'first') {
+        map.mapList = this.maplist
+      }
+      this.axios.post('/api/v1/qms/allowEnFactory', map).then(res => {
+        if (res.data.code == '200') {
+          this.$message.success('放行成功，等待进厂')
+          this.maplist = []
+          this.$refs.mutiData.clearSelection()
+          this.getNoSpellingArray()
+          this.getSpellingArray()
+          this.getStoreArray()
+          this.redDotNum = null
+          this.totalQueueNum = null
+          this.totalQueueNumFirst = null
+          this.i = 0
+          clearInterval(this.timer)
+          this.start()
         } else {
-          this.$message.error("请按顺序勾选");
-          this.maplist = [];
-          this.$refs.mutiData.clearSelection();
-          this.getNoSpellingArray();
-          this.getSpellingArray();
-          this.getStoreArray();
-          this.redDotNum = null;
-          this.totalQueueNum = null;
-          this.totalQueueNumFirst = null;
-          this.i = 0;
-          clearInterval(this.timer);
-          this.start();
+          this.$message.error('请按顺序勾选')
+          this.maplist = []
+          this.$refs.mutiData.clearSelection()
+          this.getNoSpellingArray()
+          this.getSpellingArray()
+          this.getStoreArray()
+          this.redDotNum = null
+          this.totalQueueNum = null
+          this.totalQueueNumFirst = null
+          this.i = 0
+          clearInterval(this.timer)
+          this.start()
         }
-      });
+      })
     },
-    changePriority(row){
-      console.log("装货点："+row.id);
-      console.log("订单id"+row.orderId);
-      console.log("物资ID"+row.materialId);
+    changePriority(row) {
+      console.log('装货点：' + row.id)
+      console.log('订单id' + row.orderId)
+      console.log('物资ID' + row.materialId)
       let map = {
         id: row.id,
         orderId: row.orderId,
         materialId: row.materialId
-      };
-      this.axios.post("/api/v1/qms/modifyLoadWarehouse",map)
-        .then((res)=>{
-          console.log(res)
-          if (res.data.code=="200"){
-            this.$message.success("更新装货点成功")
-          }else {
-            this.$message.error("更新装货点失败")
-          }
-        })
+      }
+      this.axios.post('/api/v1/qms/modifyLoadWarehouse', map).then(res => {
+        console.log(res)
+        if (res.data.code == '200') {
+          this.$message.success('更新装货点成功')
+        } else {
+          this.$message.error('更新装货点失败')
+        }
+      })
       //this.axios.post("")
     }
   }
-};
+}
 </script>
 <style lang="scss" scoped>
 .sale {

src/views/statisticalReport/app.html

@@ -6,6 +6,7 @@
     <meta name="renderer" content="webkit">
     <meta content="智慧物流平台" name="keywords">
     <meta content="智慧物流平台" name="description">
+    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
     <title>统计报表 - 智慧物流平台</title>
     <link href="../static/css/common.css" rel="stylesheet"/>
     <link href="../static/img/favicon.ico" rel="shortcut icon"/>

src/views/statisticalReport/app.js

@@ -1,102 +1,133 @@
 // The Vue build version to load with the `import` command
 // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
-import Vue from "vue";
-import App from "@/components/App.vue";
+import Vue from 'vue'
+import App from '@/components/App.vue'
 // include
-import "@/config/include.js";
+import '@/config/include.js'
 
 // 通用store
-import store from "@/store/index.js";
+import store from '@/store/index.js'
 
 // router
-import router from "./router/index.js";
+import router from './router/index.js'
 
-import VueApollo from "vue-apollo";
+import VueApollo from 'vue-apollo'
 
-import apollo from "@/config/apolloConfig.js";
+import apollo from '@/config/apolloConfig.js'
 
 // 注册表格的全局组件
-import DilCommonUI from "@/components/DilCommonUI";
-Vue.use(DilCommonUI);
+import DilCommonUI from '@/components/DilCommonUI'
+Vue.use(DilCommonUI)
 
 // 导出Excel全局组件
-import tableToExcel from "@/components/exportExcel/exportExcel";
-Vue.use(tableToExcel);
+import tableToExcel from '@/components/exportExcel/exportExcel'
+Vue.use(tableToExcel)
 
-import htmlToPdf from "@/components/exportPdfs/exportPdfs";
-Vue.use(htmlToPdf);
+import htmlToPdf from '@/components/exportPdfs/exportPdfs'
+Vue.use(htmlToPdf)
 //导出PDF组件
-import "xe-utils";
-import VXETable from "vxe-table";
-import "vxe-table/lib/style.css";
-Vue.use(VXETable);
-Vue.prototype.$XModal = VXETable.modal;
+import 'xe-utils'
+import VXETable from 'vxe-table'
+import 'vxe-table/lib/style.css'
+Vue.use(VXETable)
+Vue.prototype.$XModal = VXETable.modal
 
+import AMap from 'vue-amap'
+window._AMapSecurityConfig = {
+  securityJsCode: '6a75ec7300ae4ba9f385d1bb452ffd21'
+}
+Vue.use(AMap)
+AMap.initAMapApiLoader({
+  key: '168d3d854afba86848eac1b055d53ca3',
+  plugin: [
+    'AMap.Autocomplete', // 输入提示插件
+    'AMap.PlaceSearch', // POI搜索插件
+    'AMap.Scale', // 右下角缩略图插件 比例尺
+    'AMap.OverView', // 地图鹰眼插件
+    'AMap.ToolBar', // 地图工具条
+    'AMap.MapType', // 类别切换控件，实现默认图层与卫星图、实施交通图层之间切换的控制
+    'AMap.PolyEditor', // 编辑 折线多，边形
+    'AMap.CircleEditor', // 圆形编辑器插件
+    'AMap.Geolocation', // 定位控件，用来获取和展示用户主机所在的经纬度位置
+    'AMap.ControlBar', // 缩放、尺寸控制器
+    'AMap.Geocoder'
+  ],
+  // 默认高德 sdk 版本为 1.4.4
+  v: '1.4.15',
+  uiVersion: '1.1.1'
+})
+
+import Share from 'vue-social-share'
+Vue.use(Share)
+
+import 'view-design/dist/styles/iview.css'
+import ViewUI from 'view-design'
+Vue.use(ViewUI)
 // 关闭生产模式下给出的提示
-Vue.config.productionTip = false;
+Vue.config.productionTip = false
 
-Vue.use(VueApollo);
+Vue.use(VueApollo)
 
 const apolloProvider = new VueApollo({
   defaultClient: apollo
-});
+})
 
 //把时间戳改为正常可读的时间
 export function renderTime(date) {
   if (date !== null) {
-    let dateee = new Date(date).toJSON();
+    let dateee = new Date(date).toJSON()
     return new Date(+new Date(dateee) + 8 * 3600 * 1000)
       .toISOString()
-      .replace(/T/g, " ")
-      .replace(/\.[\d]{3}Z/, "");
+      .replace(/T/g, ' ')
+      .replace(/\.[\d]{3}Z/, '')
   }
-  return null;
+  return null
 }
 //把毫秒数转换分
 export function getDuration(my_time) {
   if (my_time !== null) {
-    return Math.floor(my_time / 1000 / 60);
+    return Math.floor(my_time / 1000 / 60)
   }
-  return null;
+  return null
 }
 export function sjTime(orderPlanInTime) {
-  var stringTime = renderTime(orderPlanInTime);
-  var timestamp1 = stringTime.replace(/-/g, "/");
-  return new Date(timestamp1).getTime();
+  var stringTime = renderTime(orderPlanInTime)
+  var timestamp1 = stringTime.replace(/-/g, '/')
+  return new Date(timestamp1).getTime()
 }
 //验证电话号码
 export function VerifyPhoneNumber(Phone) {
-  var myreg = /^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/;
+  var myreg = /^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/
   if (!myreg.test(Phone)) {
-    return false;
+    return false
   } else {
-    return true;
+    return true
   }
 }
 export function isNumber(value) {
   //验证是否为数字
-  var patrn = /^(-)?\d+(\.\d+)?$/;
-  if (patrn.exec(value) == null || value == "") {
-    return false;
+  var patrn = /^(-)?\d+(\.\d+)?$/
+  if (patrn.exec(value) == null || value == '') {
+    return false
   } else {
-    return true;
+    return true
   }
 }
 export function isIntegerNumber(value) {
   //验证是否为整数
-  var patrn = /^\+?[1-9][0-9]*$/g;
-  if (patrn.exec(value) == null || value == "") {
-    return false;
+  var patrn = /^\+?[1-9][0-9]*$/g
+  if (patrn.exec(value) == null || value == '') {
+    return false
   } else {
-    return true;
+    return true
   }
 }
 /* eslint-disable no-new */
 new Vue({
-  el: "#app",
+  el: '#app',
   router,
   store,
   components: { App },
   provide: apolloProvider.provide(),
-  template: "<App/>"
-});
+  template: '<App/>'
+})

src/views/statisticalReport/components/salesLogisticsStatistics/mapTest.vue

@@ -0,0 +1,848 @@
+<template>
+  <div class="container">
+    <div id="amap-container">
+      <el-row style="margin-left:250px">
+        <el-button type="primary" @click="slow">慢速</el-button>
+        <el-button type="success" @click="middle">中速</el-button>
+        <el-button type="danger" @click="fast">快速</el-button>
+        <el-button type="success" @click="addIndex" plain>快进</el-button>
+        <el-button type="danger" @click="stop" plain>暂停</el-button>
+        <el-button type="success" @click="play" plain>开始</el-button>
+        <el-select
+          style="width:100px"
+          @change="changeParkingTime"
+          v-model="parkingTime"
+          placeholder="停车"
+        >
+          <el-option
+            v-for="item in parkingOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          style="width:100px"
+          @change="changeLeaveTime"
+          v-model="leaveTime"
+          placeholder="离线"
+        >
+          <el-option
+            v-for="item in parkingOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </el-row>
+    </div>
+    <div class="mapcontroller">
+      <div class="in_transit_information">
+        <label class="item_details">起点:{{ startPointName }}</label>
+        <br />
+        <label class="item_details">收货地址:{{ endPointName }}</label>
+        <br />
+      </div>
+      <div class="driving_information2">
+        <label class="item_details">时间:{{ runRoute.gtm }}</label>
+        <br />
+        <label class="item_details">车速:{{ runRoute.spd }}千米/小时</label>
+        <br />
+        <br />
+        <!--控制条-->
+        <div class="map-control" v-show="isActual">
+          <!--播放暂停按钮-->
+          <Icon
+            v-if="!isPlay"
+            class="play-icon play"
+            type="ios-play"
+            @click="
+              isPlay = true
+              play()
+              navgControl(playIcon)
+            "
+          />
+          <Icon
+            v-else
+            class="play-icon pause"
+            type="ios-pause"
+            @click="
+              isPlay = false
+              stop()
+              navgControl('pause')
+            "
+          />
+          <Icon class="play-icon quickly" type="ios-play" @click="addIndex()" />
+          <!--已播放时间-->
+          <!--进度条-->
+          <div class="mySlider">
+            <Slider
+              class="map-slider"
+              v-model="sliderVal"
+              :tip-format="hideFormat"
+              :step="0.0001"
+            ></Slider>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="btnx">
+      <el-button type="primary" class="" @click="openInfo"
+        >打开信息窗体</el-button
+      >
+      <el-button type="primary" class="" @click="closeinfo"
+        >关闭信息窗口</el-button
+      >
+    </div>
+  </div>
+</template>
+
+<script>
+import { shallowRef } from '@vue/reactivity'
+import { lazyAMapApiLoaderInstance } from 'vue-amap'
+import Slider from './slider.vue'
+Vue.use(Slider)
+import Vue from 'vue'
+var infoWindow
+export default {
+  name: 'PathView',
+  props: {
+    orderNumber: '',
+    capacityNumber: '',
+    startPointName: '',
+    endPointName: ''
+  },
+  setup() {
+    const map = shallowRef(null)
+    return {
+      map
+    }
+  },
+  watch: {
+    //监听车牌号变化
+    orderNumber: {
+      deep: true,
+      handler(val, oldVal) {
+        console.log(val)
+        this.initData(val)
+      }
+    }
+  },
+  data() {
+    return {
+      ///che
+      isTimesChoose: false,
+      isActual: true,
+      isPlay: false,
+      passedTime: '12:02:10',
+      sliderVal: 0,
+      times: 1,
+      totalTime: '11',
+      speed: 10000,
+      startTime: '',
+      endTime: '',
+      //选择停车时长
+      parkingTime: null,
+      //停车时长选择区间
+      parkingOptions: [
+        {
+          value: 600000,
+          label: '10分钟'
+        },
+        {
+          value: 1200000,
+          label: '20分钟'
+        },
+        {
+          value: 1800000,
+          label: '30分钟'
+        },
+        {
+          value: 2400000,
+          label: '40分钟'
+        },
+        {
+          value: 3000000,
+          label: '50分钟'
+        },
+        {
+          value: 3600000,
+          label: '60分钟'
+        },
+        {
+          value: 36000000,
+          label: '关闭'
+        }
+      ],
+      //离线图标
+      leaveMark: [],
+      //停车图标
+      parkMark: [],
+      //选择离线时长
+      leaveTime: null,
+      //离线时长选择区间
+      leaveOptions: [
+        {
+          value: 600000,
+          label: '10分钟'
+        },
+        {
+          value: 1200000,
+          label: '20分钟'
+        },
+        {
+          value: 1800000,
+          label: '30分钟'
+        },
+        {
+          value: 2400000,
+          label: '40分钟'
+        },
+        {
+          value: 3000000,
+          label: '50分钟'
+        },
+        {
+          value: 3600000,
+          label: '60分钟'
+        },
+        {
+          value: 36000000,
+          label: '关闭'
+        }
+      ],
+      //已行驶轨迹
+      runRoute: {
+        agl: '',
+        gtm: '',
+        hgt: '',
+        lat: '',
+        lon: '',
+        mil: '',
+        spd: ''
+      },
+      point: '',
+      pointNext: '',
+      loading: null,
+      navgtrSpeed: 1,
+      //地图中心位置
+      centerPoint: {
+        pointLat: '',
+        pointLon: ''
+      },
+      //自定义窗体信息
+      ctmarkes: {
+        lat: '33.015888071433764',
+        lon: '115.96995235868168',
+        title: '豫SE8888',
+        details: '安徽省阜阳市颍东区阜阳舜岳水泥公司,西北方向,155.1米'
+      },
+      //运输详情
+      transportDetail: {
+        //车牌号
+        capacityNumber: '',
+        //规划路线
+        estimateRoute: [
+          {
+            lat: '33.015888071433764',
+            lon: '115.96995235868168'
+          }
+        ],
+        //规划线路
+        estimatePath: [[114.03046212985384, 32.49786984660489]],
+        //已行驶轨迹
+        runRoute: [
+          {
+            agl: '44',
+            gtm: '2022年03月09日 16:47:24',
+            hgt: '13',
+            lat: '32.906411535084985',
+            lon: '115.76177868692135',
+            mil: '429409.2',
+            spd: '17.0'
+          }
+        ],
+        runPath: [[114.03922119568348, 32.49746162481379]],
+        //当前位置
+        currentPointName: '中国达州市通川区',
+        //当前位置经纬度
+        currentPoint: {
+          lat: '',
+          lon: ''
+        },
+        //起点位置
+        startPointName: '中国达州市通川区',
+        //起点位置经纬度
+        startPoint: {
+          lon: '114.03922119568348',
+          lat: '32.49746162481379'
+        },
+        //终点位置
+        endPointName: '中国成都萧山',
+        //终点位置经纬度
+        endPoint: {
+          lon: '115.96995737755431',
+          lat: '33.01595479752097'
+        },
+        //自定义标记
+        content: [],
+        //异常位置
+        abnormalLocation: []
+      },
+      listPath: [],
+      //组件
+      pathSimplifierIns: {},
+      pathNavigator: {},
+      //地图解析
+      geocoder: null,
+      currentPointName: ''
+    }
+  },
+  created() {
+    let that = this
+    that.initData(that.orderNumber)
+  },
+  mounted() {},
+  methods: {
+    //停车时间改变
+    changeParkingTime() {
+      let that = this
+      //清除之前的停车点
+      that.hideParkingMark()
+      //计算时间的点
+      let calculationPoint = null
+      that.listPath[0].runRoute.forEach(function(item, indexOf) {
+        if (indexOf + 1 < that.listPath[0].runRoute.length) {
+          //判断calculationPoint是否为空，如果是空的说明当前没有在计算停车时间
+          if (calculationPoint == null && item.spd == '0.0') {
+            calculationPoint = item
+          } else if (calculationPoint != null && item.spd != '0.0') {
+            let beforeTime = that.stringToDate(calculationPoint.gtm)
+            let item2 = that.listPath[0].runRoute[indexOf]
+            let afterTime = that.stringToDate(item2.gtm)
+            let second = afterTime - beforeTime
+            if (second > that.parkingTime) {
+              let message = '停车:' + second / 60000
+              that.initParkingMarkes(
+                20,
+                35,
+                require('@/assets/img/park.png'),
+                calculationPoint.lon,
+                calculationPoint.lat,
+                message.split('.')[0] + '分钟'
+              )
+            }
+            calculationPoint = null
+          }
+        }
+      })
+    },
+    //字符串转为Date
+    stringToDate(dateString) {
+      console.log(dateString)
+      let dateStr = dateString
+        .replace('年', '-')
+        .replace('月', '-')
+        .replace('日', '')
+      return Date.parse(dateStr)
+    },
+    //停车所有离线图标
+    hideParkingMark() {
+      let that = this
+
+      that.parkMark.forEach(function(item, indexOf) {
+        item.hide()
+      })
+    },
+    //离线时间改变时获得超过时间的点信息
+    changeLeaveTime() {
+      let that = this
+      //关闭所有图标
+      that.hideLeaveMark()
+      that.listPath[0].runRoute.forEach(function(item, indexOf) {
+        if (indexOf + 1 < that.listPath[0].runRoute.length) {
+          let beforeTime = that.stringToDate(item.gtm)
+          let item2 = that.listPath[0].runRoute[indexOf + 1]
+          let afterTime = that.stringToDate(item2.gtm)
+          let second = afterTime - beforeTime
+          if (second > that.leaveTime) {
+            let message = '离线:' + second / 60000
+            that.initLeaveMarkes(
+              20,
+              35,
+              require('@/assets/img/leave.png'),
+              item2.lon,
+              item2.lat,
+              message.split('.')[0] + '分钟'
+            )
+          }
+        }
+      })
+    },
+    //关闭所有离线图标
+    hideLeaveMark() {
+      let that = this
+      that.leaveMark.forEach(function(item, indexOf) {
+        item.hide()
+      })
+    },
+    slow() {
+      console.log('slow')
+      let that = this
+      that.pathNavigator.setSpeed(1000)
+    },
+    middle() {
+      console.log('middle')
+      let that = this
+      that.pathNavigator.setSpeed(10000)
+    },
+    fast() {
+      console.log('fast')
+      let that = this
+      that.pathNavigator.setSpeed(100000)
+    },
+    play() {
+      let that = this
+      that.pathNavigator.resume()
+    },
+    stop() {
+      let that = this
+      that.pathNavigator.pause()
+    },
+    addIndex() {
+      let that = this
+      let increment = that.listPath[0].runPath.length * 0.1
+      that.pathNavigator.start(
+        (that.point + increment) % that.listPath[0].runPath.length
+      )
+    },
+    ///che
+    navgControl() {},
+    hideFormat(value) {
+      let that = this
+      that.sliderVal = value
+    },
+    initParkingMarkes(weight, height, image, lon, lat, title) {
+      let that = this
+      //图标标记点
+      let pointicon = new AMap.Icon({
+        size: new AMap.Size(weight, height), // 图标尺寸
+        image: image, // Icon的图像
+        imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等
+        imageSize: new AMap.Size(weight, height) // 根据所设置的大小拉伸或压缩图片
+      })
+      // 创建一个 Marker 实例：
+      var pointmarker = new AMap.Marker({
+        position: new AMap.LngLat(lon, lat), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+        icon: pointicon,
+        title: title
+      })
+      that.parkMark.push(pointmarker)
+      // 将创建的点标记添加到已有的地图实例：
+      that.map.add(pointmarker)
+    },
+    //创建离线和停车的标记
+    initLeaveMarkes(weight, height, image, lon, lat, title) {
+      let that = this
+      //图标标记点
+      let pointicon = new AMap.Icon({
+        size: new AMap.Size(weight, height), // 图标尺寸
+        image: image, // Icon的图像
+        imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等
+        imageSize: new AMap.Size(weight, height) // 根据所设置的大小拉伸或压缩图片
+      })
+      // 创建一个 Marker 实例：
+      var pointmarker = new AMap.Marker({
+        position: new AMap.LngLat(lon, lat), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+        icon: pointicon,
+        title: title
+      })
+      that.leaveMark.push(pointmarker)
+      // 将创建的点标记添加到已有的地图实例：
+      that.map.add(pointmarker)
+    },
+    initData(orderNumber) {
+      let that = this
+      that.axios
+        .post('/api/v1/otms/fullPath?orderNumber=' + orderNumber)
+        .then(res => {
+          console.log(res.data)
+          if (res.data.data == '-1') {
+            this.$message.error('运输订单未关闭的自提车辆无权查看!')
+          } else if (res.data.data.startAndEndRoutes != null) {
+            that.listPath = res.data.data.startAndEndRoutes
+            that.startTime = res.data.data.startAndEndRoutes[0].runRoute[0].gtm
+            that.endTime =
+              res.data.data.startAndEndRoutes[0].runRoute[
+                res.data.data.startAndEndRoutes[0].runRoute.length - 1
+              ].gtm
+            that.initMap()
+          } else {
+            that.listPath = []
+            this.$message.error('车辆没有开启GPS')
+          }
+        })
+    },
+    endline() {
+      let that = this
+      that.initPolyline(that.listPath[0].estimatePath, '#FF0000')
+    },
+    //创建起点终点当前点
+    threeMarker() {
+      let that = this
+      that.listPath.forEach((element, index) => {
+        //开始标记点
+        if (element.startPoint.lon != '' && element.startPoint.lat != '') {
+          that.initMarkes(
+            20,
+            35,
+            require('@/assets/img/start.png'),
+            element.startPoint.lon,
+            element.startPoint.lat,
+            '起点'
+          )
+        }
+        //当前点
+        that.getCurrentPointName([
+          element.runRoute[element.runRoute.length - 1].lon,
+          element.runRoute[element.runRoute.length - 1].lat
+        ])
+        //结束标记点
+        if (element.endPoint.lon != '' && element.endPoint.lat != '') {
+          that.initMarkes(
+            20,
+            35,
+            require('@/assets/img/end.png'),
+            element.endPoint.lon,
+            element.endPoint.lat,
+            '终点'
+          )
+        }
+      })
+    },
+    //获得结束地址
+    getCurrentPointName(lnglatXY) {
+      let that = this
+      that.geocoder.getAddress(lnglatXY, function(status, result) {
+        if (status === 'complete' && result.info === 'OK') {
+          that.currentPointName = result.regeocode.formattedAddress
+          that.initCustomMarkes(
+            that.capacityNumber,
+            '位置：' +
+              that.currentPointName +
+              '<br/>' +
+              '距离：' +
+              that.listPath[0].miled +
+              '<br/>' +
+              '时间范围：' +
+              that.startTime +
+              ' 至 ' +
+              that.endTime,
+
+            lnglatXY[0],
+            lnglatXY[1]
+          )
+        }
+      })
+    },
+    //defualt数据
+    defaultDate() {
+      // let that=this;
+      // that.pathNavigator.start(that.listPath[0].runPath.length)
+      // that.pathNavigator.pause();
+    },
+    //初始化地图
+    initMap() {
+      lazyAMapApiLoaderInstance.load().then(() => {
+        let that = this
+        that.map = new AMap.Map('amap-container', {
+          //设置地图容器id
+          viewMode: '2D', //是否为2D地图模式
+          zoom: 10, //初始化地图级别
+          center: [105.602725, 37.076636] //初始化地图中心点位置
+        })
+        that.initGeocoder()
+        that.initPathSimplifier()
+        that.threeMarker()
+        //that.initCustomMarkes(that.capacityNumber+"("+that.listPath[0].miled+")",that.listPath[0].currentPointName,that.listPath[0].currentPoint.lon,that.listPath[0].currentPoint.lat)
+        that.endline()
+      })
+    },
+    initCustomMarkes(title, details, lon, lat) {
+      let that = this
+      //自定义窗体内容
+      var content = [
+        "<div  style='top:1px;width: 200px; background-color: rgba(22, 160, 133, 1);' ><font color='white'>" +
+          title +
+          '</font>',
+        "<div style='background-color:(22, 160, 133, 1); ;'><font color='white'>" +
+          details +
+          '</font></div></div>'
+      ]
+      // 创建 infoWindow 实例
+      infoWindow = new AMap.InfoWindow({
+        content: content.join('<br>') //传入 dom 对象，或者 html 字符串
+      })
+      // 打开信息窗体
+      infoWindow.open(that.map, [lon, lat])
+    },
+    // 关闭信息窗口
+    closeinfo() {
+      infoWindow.close()
+    },
+    openInfo() {
+      let lon = null
+      let lat = null
+      console.log(this.listPath)
+      this.listPath.forEach(e => {
+        if (e.endPoint != {} && e.endPoint != '' && e.endPoint != null) {
+          lon = e.endPoint.lon
+          lat = e.endPoint.lat
+        } else {
+          lon = e.runRoute[e.runRoute.length - 1].lon
+          lat = e.runRoute[e.runRoute.length - 1].lat
+        }
+      })
+      infoWindow.open(this.map, [lon, lat])
+    },
+    initPolyline(path, color) {
+      let that = this
+      //预计轨迹
+      var endLine = new AMap.Polyline({
+        map: that.map,
+        path: path,
+        isOutline: true,
+        outlineColor: color,
+        borderWeight: 0,
+        strokeColor: '#FF0000',
+        strokeOpacity: 1,
+        strokeWeight: 5,
+        // 折线样式还支持 'dashed'
+        strokeStyle: 'solid',
+        // strokeStyle是dashed时有效
+        strokeDasharray: [10, 5],
+        lineJoin: 'round',
+        lineCap: 'round',
+        zIndex: 50
+      })
+      that.map.setFitView([[endLine]])
+    },
+    //创建简单的标记
+    initMarkes(weight, height, image, lon, lat, title) {
+      let that = this
+      //图标标记点
+      let pointicon = new AMap.Icon({
+        size: new AMap.Size(weight, height), // 图标尺寸
+        image: image, // Icon的图像
+        imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等
+        imageSize: new AMap.Size(weight, height) // 根据所设置的大小拉伸或压缩图片
+      })
+      // 创建一个 Marker 实例：
+      var pointmarker = new AMap.Marker({
+        position: new AMap.LngLat(lon, lat), // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+        icon: pointicon,
+        title: title
+      })
+      // 将创建的点标记添加到已有的地图实例：
+      that.map.add(pointmarker)
+    },
+    //创建轨迹和巡航器
+    initPathSimplifier() {
+      let that = this
+      // ...你的操作
+      new AMapUI.load(['ui/misc/PathSimplifier'], PathSimplifier => {
+        if (!PathSimplifier.supportCanvas) {
+          alert('当前环境不支持 Canvas！')
+          return
+        }
+        //创建轨迹和巡航器
+        // 创建组件实例
+        that.pathSimplifierIns = new PathSimplifier({
+          map: that.map,
+          zIndex: 100, // 图层叠加顺序
+          data: that.listPath, // 巡航路径
+          // 获取巡航路径中的路径坐标数组
+          getPath: (pathData, pathIndex) => {
+            return pathData.runPath
+          },
+          //鼠标悬浮停时显示消息
+          getHoverTitle: function(pathData, pathIndex, pointIndex) {
+            //返回鼠标悬停时显示的信息
+            if (pointIndex >= 0) {
+              if (pathData.runRoute[pointIndex].gtm !== 'undefined') {
+                //鼠标悬停在某个轨迹节点上
+                return (
+                  pathData.runRoute[pointIndex].gtm +
+                  '，速度' +
+                  pathData.runRoute[pointIndex].spd +
+                  '千米/小时'
+                )
+              }
+            }
+          },
+          //设置轨迹样式
+          renderOptions: {
+            //轨迹线的样式
+            pathLineStyle: {
+              strokeStyle: 'black',
+              lineWidth: 6,
+              dirArrowStyle: true
+            }
+          }
+        })
+        // 创建巡航器
+        that.pathNavigator = that.pathSimplifierIns.createPathNavigator(0, {
+          loop: true, // 是否循环
+          speed: that.speed, // 速度(km/h)
+          pathNavigatorStyle: {
+            width: 20,
+            height: 40,
+            content: PathSimplifier.Render.Canvas.getImageContent(
+              require('@/assets/img/smallcar.png'),
+              onload,
+              onerror
+            ),
+            strokeStyle: null,
+            fillStyle: null
+          }
+        })
+        //开启巡航
+        that.pathNavigator.start()
+        that.defaultDate()
+
+        //开始事件
+        that.pathNavigator.on('start resume', function() {
+          // that.navgtr._startTime = Date.now();
+          // that.navgtr._startDist = this.getMovedDistance();
+        })
+        //暂停
+        that.pathNavigator.on('stop pause', function() {
+          // that.navgtr._movedTime = Date.now() - that.navgtr._startTime;
+          // that.navgtr._movedDist = this.getMovedDistance() - that.navgtr._startDist;
+        })
+        that.pathNavigator.on('move', function(data, value) {
+          that.updateLable(value)
+        })
+      })
+    },
+    updateLable(value) {
+      let that = this
+      that.point = value.dataItem.pointIndex
+      that.runRoute = value.dataItem.pathData.runRoute[that.point]
+      that.sliderVal =
+        (value.dataItem.pointIndex / value.dataItem.pathData.runRoute.length) *
+        100
+    },
+    changeSpeed(value) {
+      // console.log(value)
+      // let that=this;
+      // that.times=value;
+    },
+    playIcon() {
+      console.log('nihoa')
+    },
+    //逆解码函数
+    initGeocoder() {
+      let that = this
+      console.log('initGeocoder')
+      AMap.plugin('AMap.Geocoder', function() {
+        that.geocoder = new AMap.Geocoder({
+          radius: 1000,
+          extensions: 'all'
+        })
+
+        console.log(that.geocoder)
+      })
+    }
+  }
+}
+</script>
+<style>
+.mapcontroller {
+  width: 250px;
+  height: 260px;
+  background: white;
+  position: absolute;
+  z-index: 99;
+  top: 0;
+  left: 0;
+}
+.container {
+  width: 100%;
+  height: 100%;
+}
+.item_details {
+  display: block;
+  margin-top: 20px;
+  position: relative;
+  left: 30px;
+  width: 200px;
+  height: 0px;
+}
+#amap-container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  margin: 0;
+  font-family: '微软雅黑';
+}
+.driving_information2 {
+  position: relative;
+  top: 70px;
+}
+.driving_information3 {
+  position: absolute;
+  z-index: 99;
+  top: 0;
+  left: 0;
+  position: relative;
+  top: 50px;
+}
+
+/* 进度条 */
+.mySlider {
+  width: 150px;
+  height: 20px;
+  display: inline-block;
+  position: relative;
+  left: 32px;
+}
+.play {
+  position: relative;
+  left: 28px;
+}
+.quickly {
+  float: right;
+  position: relative;
+  left: -20px;
+  top: 10px;
+}
+.pause {
+  position: relative;
+  left: 28px;
+}
+.passed-time {
+  position: relative;
+  left: 5px;
+}
+.end-time {
+  position: relative;
+  left: 5px;
+}
+.map-times {
+  position: relative;
+  background-color: red;
+  width: 40px;
+}
+</style>
+<style lang="scss" scoped>
+.btnx {
+  z-index: 1000;
+  position: fixed;
+  bottom: 10px;
+  right: 10px;
+}
+</style>

src/views/statisticalReport/components/salesLogisticsStatistics/saleSteelReports.vue

@@ -50,20 +50,20 @@
         </el-form-item>
         <el-form-item>
           <label class="el-form-item__label" style="width: auto;"
-            >订单时间：</label
+            >订单日期：</label
           >
           <el-date-picker
             v-model="startTime"
-            type="datetime"
-            placeholder="选择日期时间"
+            type="date"
+            placeholder="选择日期"
             style="width:180px"
           >
           </el-date-picker>
           <span>至</span>
           <el-date-picker
             v-model="endTime"
-            type="datetime"
-            placeholder="选择日期时间"
+            type="date"
+            placeholder="选择日期"
             style="width:180px"
           >
           </el-date-picker>
@@ -96,9 +96,11 @@
         ref="tableRef"
         border
         style="width: 100%; margin-top: 20px"
-        max-height="650px"
-        :row-style="{ height: '30px' }"
+        :max-height="maxHeight"
+        :height="maxHeight"
+        :row-style="{ height: '30' }"
         :cell-style="{ fontWeight: '500' }"
+        @cell-click="cellClik"
       >
         <el-table-column
           width="50"
@@ -111,8 +113,9 @@
         <el-table-column
           prop="orderTime"
           label="订单日期"
-          width="160px"
+          width="120px"
           align="center"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
@@ -127,7 +130,8 @@
           prop="carrierName"
           label="承运商"
           align="center"
-          width="120px"
+          width="100px"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
@@ -135,7 +139,8 @@
           column-key="capacityNo"
           label="车牌号"
           align="center"
-          width="150px"
+          width="140px"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
@@ -143,6 +148,7 @@
           label="物资名称"
           align="center"
           width="150px"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
@@ -150,31 +156,71 @@
           label="物资规格"
           align="center"
           sortable
+          show-overflow-tooltip
+          width="120px"
         >
         </el-table-column>
         <el-table-column
           prop="materialNum"
           label="物资件数"
           align="center"
-          width="150px"
+          width="100px"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="addressPlace"
+          label="收货地址"
+          width="250px"
+          show-overflow-tooltip
         >
         </el-table-column>
-        <el-table-column prop="addressPlace" label="收货地址" width="200px">
+        <el-table-column
+          prop="orderStatus"
+          label="运单状态"
+          align="center"
+          show-overflow-tooltip
+        >
         </el-table-column>
-        <el-table-column prop="orderStatus" label="运单状态" align="center">
+        <el-table-column prop="grossWeight" label="毛重" show-overflow-tooltip>
         </el-table-column>
-        <el-table-column prop="grossWeight" label="毛重"> </el-table-column>
-        <el-table-column prop="grossWeightTime" label="毛重时间" width="130px">
+        <el-table-column
+          prop="grossWeightTime"
+          label="毛重时间"
+          width="130px"
+          show-overflow-tooltip
+        >
         </el-table-column>
-        <el-table-column prop="tareWeight" label="皮重"> </el-table-column>
-        <el-table-column prop="tareWeightTime" label="皮重时间" width="130px">
+        <el-table-column prop="tareWeight" label="皮重" show-overflow-tooltip>
         </el-table-column>
-        <el-table-column prop="netWeight" label="净重"> </el-table-column>
-        <el-table-column prop="entryGateTime" label="进厂时间" width="130px">
+        <el-table-column
+          prop="tareWeightTime"
+          label="皮重时间"
+          width="130px"
+          show-overflow-tooltip
+        >
         </el-table-column>
-        <el-table-column prop="loadTime" label="装货时间" width="130px">
+        <el-table-column prop="netWeight" label="净重" show-overflow-tooltip>
         </el-table-column>
-        <el-table-column prop="outGateTime" label="出厂时间" width="130px">
+        <el-table-column
+          prop="entryGateTime"
+          label="进厂时间"
+          width="130px"
+          show-overflow-tooltip
+        >
+        </el-table-column>
+        <el-table-column
+          prop="loadTime"
+          label="装货时间"
+          width="130px"
+          show-overflow-tooltip
+        >
+        </el-table-column>
+        <el-table-column
+          prop="outGateTime"
+          label="出厂时间"
+          width="130px"
+          show-overflow-tooltip
+        >
         </el-table-column>
         <el-table-column
           prop="arrivalAddress"
@@ -195,36 +241,47 @@
           label="运输订单号"
           width="180px"
           align="center"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
           prop="capacityTel"
           label="司机电话"
-          width="250px"
+          width="120px"
           align="center"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
           prop="isPrintDelivery"
           label="送货单打印状态"
           align="center"
-          width="150px"
+          width="120px"
+          show-overflow-tooltip
         >
-          <template slot-scope="scope">
-            <span v-show="scope.row.isPrintDelivery">已打印</span>
-          </template>
         </el-table-column>
-        <el-table-column prop="saler" label="业务员" align="center">
+        <el-table-column
+          prop="saler"
+          label="业务员"
+          align="center"
+          show-overflow-tooltip
+        >
         </el-table-column>
         <el-table-column
           prop="shipperName"
           label="发货单位"
           width="170px"
           align="center"
+          show-overflow-tooltip
         >
         </el-table-column>
-        <el-table-column prop="truckNo" label="车序号"> </el-table-column>
-        <el-table-column prop="consigneeTel" label="收货客户电话" width="120px">
+        <el-table-column
+          prop="consigneeTel"
+          label="收货客户电话"
+          width="120px"
+          align="center"
+          show-overflow-tooltip
+        >
         </el-table-column>
         <el-table-column prop="isSelfMention" label="是否自提" align="center">
         </el-table-column>
@@ -233,15 +290,22 @@
           label="销售订单号"
           width="200px"
           align="center"
+          show-overflow-tooltip
         >
         </el-table-column>
         <el-table-column
           prop="saleOrderStatus"
           label="销售订单状态"
           width="100px"
+          show-overflow-tooltip
         >
         </el-table-column>
-        <el-table-column prop="closeEntryId" label="金蝶分录ID" width="100px">
+        <el-table-column
+          prop="closeEntryId"
+          label="金蝶分录ID"
+          width="100px"
+          show-overflow-tooltip
+        >
         </el-table-column>
         <el-table-column
           prop="operation"
@@ -251,13 +315,53 @@
           align="center"
         >
           <template slot-scope="scope">
-            <el-button type="text" @click="operation(scope.row)"
+            <el-button
+              type="text"
+              @click="checkTrans(scope.row)"
+              v-if="scope.row.outGateTime != null"
+              >轨迹</el-button
+            >
+            <el-button
+              type="text"
+              @click="operation(scope.row)"
+              v-if="scope.row.carStatus != 2"
               >编辑</el-button
             >
           </template>
         </el-table-column>
       </el-table>
     </div>
+    <div>
+      <vxe-modal
+        width="549px"
+        height="731px"
+        v-model="isShow3"
+        show-footer
+        class="vxeModal"
+      >
+        <div class="demo-image__preview">
+          <el-image style=" height:731px;text-align:center;" :src="src">
+            <div slot="error" class="image-slot">
+              <span>司机未上传图片</span>
+            </div>
+          </el-image>
+        </div>
+      </vxe-modal>
+      <vxe-modal width="549px" height="731px" v-model="isShow4" show-footer>
+        <div
+          class="demo-image__preview"
+          v-for="item in srcList2"
+          :key="item.src"
+        >
+          <span>{{ item.title }}</span>
+          <el-image style="height:731px;text-align:center" :src="item.src">
+            <div slot="error" class="image-slot">
+              <span>司机未上传图片</span>
+            </div>
+          </el-image>
+        </div>
+      </vxe-modal>
+    </div>
     <div class="dialog">
       <el-dialog
         title="运单详情"
@@ -437,7 +541,7 @@
                   type="success"
                   icon="el-icon-money"
                   circle
-                  @click="toPhotoClick"
+                  @click="toPhotoClick(steelMap.orderNo, 0)"
                 ></el-button
               ></span>
             </div>
@@ -451,13 +555,12 @@
                   type="success"
                   icon="el-icon-money"
                   circle
-                  @click="receipctPhotoClick"
+                  @click="receipctPhotoClick(steelMap.orderNo, 0)"
                 ></el-button
               ></span>
             </div>
           </div>
         </div>
-
         <div class="table">
           <el-table
             :data="steelMap.mapList"
@@ -562,28 +665,44 @@
             >确 定</el-button
           >
         </span>
-      </el-dialog>
-    </div>
-    <div>
-      <vxe-modal width="549px" height="731px" v-model="isShow" show-footer>
-        <div class="demo-image__preview">
-          <el-image
-            style=" height:731px;text-align:center;"
-            :src="src"
-            :preview-src-list="srcList"
+        <div>
+          <vxe-modal
+            width="549px"
+            height="731px"
+            v-model="isShow"
+            show-footer
+            class="vxeModal"
           >
-          </el-image>
-        </div>
-      </vxe-modal>
-      <vxe-modal width="549px" height="731px" v-model="isShow2" show-footer>
-        <div class="demo-image__preview">
-          <el-image
-            style=" height:731px;text-align:center"
-            :src="src2"
-            :preview-src-list="srcList2"
-          >
-          </el-image>
+            <div class="demo-image__preview">
+              <el-image style=" height:731px;text-align:center;" :src="src">
+                <div slot="error" class="image-slot">
+                  <span>司机未上传图片</span>
+                </div>
+              </el-image>
+            </div>
+          </vxe-modal>
+          <vxe-modal width="549px" height="731px" v-model="isShow2" show-footer>
+            <div
+              class="demo-image__preview"
+              v-for="(item, index) in srcList2"
+              :key="index"
+            >
+              <span>{{ item.title }}</span>
+              <el-image style="height:731px;text-align:center" :src="item.src">
+                <div slot="error" class="image-slot">
+                  <span>司机未上传图片</span>
+                </div>
+              </el-image>
+            </div>
+          </vxe-modal>
         </div>
+      </el-dialog>
+    </div>
+    <div style="height: 100%">
+      <vxe-modal width="1237" height="731" v-model="value7" show-zoom resize>
+        <template #default>
+          <PathView v-bind.sync="pathOption"></PathView>
+        </template>
       </vxe-modal>
     </div>
   </div>
@@ -592,8 +711,11 @@
 <script>
 import { sjTime, isVehicleNumber } from '@/utils/sharedJsFile'
 import { getCookie } from '@/utils/util.js'
-
+import PathView from './mapTest.vue'
 export default {
+  components: {
+    PathView
+  },
   data() {
     return {
       consigneeFiltList: [],
@@ -604,6 +726,8 @@ export default {
       //钢材子表数据
       steelList: [],
       drawer: false,
+      isShow3: false,
+      isShow4: false,
       input: null,
       screen: '',
       screen1: '',
@@ -666,7 +790,6 @@ export default {
         '收货地址',
         '业务员',
         '送货单打印状态',
-        '车序号',
         '收货客户电话',
         '金蝶分录ID',
         '是否自提',
@@ -718,15 +841,64 @@ export default {
       srcList2: [],
       src2: '',
       isShow2: false,
-      input1: ''
+      input1: '',
+      maxHeight: window.innerHeight - 140,
+      value7: false,
+      pathOption: {
+        orderNumber: '',
+        capacityNumber: '',
+        startPointName: '',
+        endPointName: ''
+      }
     }
   },
   created() {
     this.getSteelReport()
   },
-  mounted() {},
+  mounted() {
+    window.onresize = () => {
+      return (() => {
+        this.maxHeight = window.innerHeight - 140
+      })()
+    }
+  },
+  activated() {
+    this.maxHeight = window.innerHeight - 140
+  },
   computed: {},
   methods: {
+    checkTrans(row) {
+      console.log(row)
+      let that = this
+      that.axios
+        .post('/api/v1/otms/fullPath?orderNumber=' + row.orderNo)
+        .then(res => {
+          console.log(res.data)
+          if (res.data.data == '-1') {
+            this.$message.error('运输订单未关闭的自提车辆无权查看!')
+          } else if (res.data.data.startAndEndRoutes != null) {
+            that.pathOption.orderNumber = row.orderNo
+            that.pathOption.capacityNumber = row.capacityNo
+            that.pathOption.startPointName = '达钢集团小东门'
+            that.pathOption.endPointName = row.arrivalAddress
+            that.value7 = true
+          } else {
+            this.$message.error('车辆没有开启GPS')
+          }
+        })
+    },
+    cellClik(row, column, cell, event) {
+      if (column.property == 'arrivalAddress') {
+        if (row.orderNo && row.arrivalAddress) {
+          this.toPhotoClick(row.orderNo, 1)
+        }
+      }
+      if (column.property == 'receiptAddress') {
+        if (row.orderNo && row.arrivalAddress) {
+          this.receipctPhotoClick(row.orderNo, 1)
+        }
+      }
+    },
     //反关闭运单
     reverseCloseOrder() {
       this.axios
@@ -759,34 +931,49 @@ export default {
         })
     },
     //查看抵达图
-    toPhotoClick() {
+    toPhotoClick(orderNo, num) {
       this.axios
-        .post(
-          '/api/v1/otms/getArrivalPhoto?orderNumber=' + this.steelMap.orderNo
-        )
+        .post('/api/v1/otms/getArrivalPhoto?orderNumber=' + orderNo)
         .then(res => {
           this.srcList = []
           this.src = res.data.data
-          this.isShow = true
+          if (num == 1) {
+            this.isShow3 = true
+          } else {
+            this.isShow = true
+          }
           this.srcList.push(res.data.data)
         })
     },
     //查看签收图
-    receipctPhotoClick() {
+    receipctPhotoClick(orderNo, num) {
       this.axios
-        .post(
-          '/api/v1/otms/getReceivingPhotoByUrl?orderNumber=' +
-            this.steelMap.orderNo
-        )
+        .post('/api/v1/otms/getReceivingPhotoByUrl?orderNumber=' + orderNo)
         .then(res => {
           console.log(res.data)
-          this.isShow2 = true
+          if (num == 1) {
+            this.isShow4 = true
+          } else {
+            this.isShow2 = true
+          }
           this.srcList2 = []
-          this.src2 = res.data.resultSignedNotePhoto
-          this.srcList2.push(res.data.resultSignedNotePhoto)
-          this.srcList2.push(res.data.resultEmptyContainerPhoto)
           if (res.data.resultReceiveNotePhoto != null) {
-            this.srcList2.push(res.data.resultReceiveNotePhoto)
+            this.srcList2.push({
+              title: '签收单',
+              src: res.data.resultReceiveNotePhoto
+            })
+          }
+          if (res.data.resultSignedNotePhoto != null) {
+            this.srcList2.push({
+              title: '质保书',
+              src: res.data.resultSignedNotePhoto
+            })
+          }
+          if (res.data.resultEmptyContainerPhoto != null) {
+            this.srcList2.push({
+              title: '空货箱照片',
+              src: res.data.resultEmptyContainerPhoto
+            })
           }
         })
     },
@@ -1480,6 +1667,12 @@ export default {
     },
     //查询，输入查询条件
     onclick() {
+      const loading = this.$loading({
+        lock: true,
+        text: '正在获取数据',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
       let startTime = null
       let endTime = null
       let carrierSsoId = null
@@ -1540,6 +1733,7 @@ export default {
         .then(res => {
           this.tableData = res.data.data
           this.getSpanArr(res.data.data)
+          loading.close()
         })
     },
     //重新获取表格数据
@@ -1613,16 +1807,6 @@ export default {
         )
         .then(res => {
           this.tableData = res.data.data
-
-          // { text: '专用线', value: '专用线' }
-          // { text: '达州站', value: '达州站' }
-          // this.consigneeFiltList = this.tableData.forEach(e => {
-          //   let map = {};
-          //   map.text = e.consigneeName;
-          //   map.value = e.consigneeName;
-          //   return map;
-          // });
-
           this.getSpanArr(res.data.data)
         })
     }

src/views/statisticalReport/components/salesLogisticsStatistics/slider.vue

@@ -0,0 +1,151 @@
+<template>
+  <div class="slider" ref="slider">
+    <div class="process" :style="{ width }"></div>
+    <div class="thunk" ref="trunk" :style="{ left }">
+      <div class="block"></div>
+      <div class="tips">
+        <span>{{ scale * 100 }}</span>
+        <i class="fas fa-caret-down"></i>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+/*
+ * min 进度条最小值
+ * max 进度条最大值
+ * v-model 对当前值进行双向绑定实时显示拖拽进度
+ * */
+export default {
+  name: 'slider',
+  props: ['min', 'max', 'value'],
+  data() {
+    return {
+      slider: null, //滚动条DOM元素
+      thunk: null, //拖拽DOM元素
+      per: this.value //当前值
+    }
+  },
+  //渲染到页面的时候
+  mounted() {
+    this.slider = this.$refs.slider
+    this.thunk = this.$refs.trunk
+    var _this = this
+    this.thunk.onmousedown = function(e) {
+      var width = parseInt(_this.width)
+      var disX = e.clientX
+      document.onmousemove = function(e) {
+        // value, left, width
+        // 当value变化的时候，会通过计算属性修改left，width
+
+        // 拖拽的时候获取的新width
+        var newWidth = e.clientX - disX + width
+        // 拖拽的时候得到新的百分比
+        var scale = newWidth / _this.slider.offsetWidth
+        _this.per = Math.ceil((_this.max - _this.min) * scale + _this.min)
+        _this.per = Math.max(_this.per, _this.min)
+        _this.per = Math.min(_this.per, _this.max)
+        _this.$emit('input', _this.per)
+      }
+      document.onmouseup = function() {
+        document.onmousemove = document.onmouseup = null
+      }
+      return false
+    }
+  },
+  computed: {
+    // 设置一个百分比，提供计算slider进度宽度和trunk的left值
+    // 对应公式为  当前值-最小值/最大值-最小值 = slider进度width / slider总width
+    // trunk left =  slider进度width + trunk宽度/2
+    scale() {
+      return (this.per - this.min) / (this.max - this.min)
+    },
+    width() {
+      if (this.slider) {
+        return this.slider.offsetWidth * this.scale + 'px'
+      } else {
+        return 0 + 'px'
+      }
+    },
+    left() {
+      if (this.slider) {
+        return (
+          this.slider.offsetWidth * this.scale -
+          this.thunk.offsetWidth / 2 +
+          'px'
+        )
+      } else {
+        return 0 + 'px'
+      }
+    }
+  }
+}
+</script>
+<style>
+.box {
+  margin: 100px auto 0;
+  width: 80%;
+}
+.clear:after {
+  content: '';
+  display: block;
+  clear: both;
+}
+.slider {
+  position: relative;
+  margin: 20px 0;
+  width: 400px;
+  height: 10px;
+  background: #e4e7ed;
+  border-radius: 5px;
+  cursor: pointer;
+}
+.slider .process {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 112px;
+  height: 10px;
+  border-radius: 5px;
+  background: #409eff;
+}
+.slider .thunk {
+  position: absolute;
+  left: 100px;
+  top: -7px;
+  width: 20px;
+  height: 20px;
+}
+.slider .block {
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  border: 2px solid #409eff;
+  background: rgba(255, 255, 255, 1);
+  transition: 0.2s all;
+}
+.slider .tips {
+  position: absolute;
+  left: -7px;
+  bottom: 30px;
+  min-width: 15px;
+  text-align: center;
+  padding: 4px 8px;
+  background: #000;
+  border-radius: 5px;
+  height: 24px;
+  color: #fff;
+}
+.slider .tips i {
+  position: absolute;
+  margin-left: -5px;
+  left: 50%;
+  bottom: -9px;
+  font-size: 16px;
+  color: #000;
+}
+.slider .block:hover {
+  transform: scale(1.1);
+  opacity: 0.6;
+}
+</style>

src/views/statisticalReport/router/index.js

@@ -1,260 +1,268 @@
-import Vue from "vue";
-import Router from "vue-router";
+import Vue from 'vue'
+import Router from 'vue-router'
 
-import routerBefore from "@/config/routerBefore.js";
+import routerBefore from '@/config/routerBefore.js'
 
 // 主要
-import main from "@/components/main.vue";
+import main from '@/components/main.vue'
 // 系统配置管理
-import ShipDynamicTable from "../components/Ship_dynamic_table.vue";
-import ShipWorkReport from "../components/ShipWorkReport.vue";
-import dowmShipDynamicTable from "../components/dowmShipDynamicTable.vue";
-import purchaseAccessoriesMonitor from "../components/purchaseAccessoriesMonitor.vue";
-import purchasFuelOldMonitor from "../components/purchasFuelMonitor/purchasFuelOldMonitor.vue";
-import purchasFuelNewMonitor from "../components/purchasFuelMonitor/purchasFuelNewMonitor.vue";
-import sporadicReportEnterFactory from "../components/sporadicReport/sporadicReportEnterFactory.vue";
-import sporadicReportExFactory from "../components/sporadicReport/sporadicReportExFactory.vue";
-import saleChemicalCokeForm from "../components/salesLogisticsStatistics/saleChemicalCokeForm.vue";
-import saleCoproductForm from "../components/salesLogisticsStatistics/saleCoproductForm.vue";
-import saleSteelForm from "../components/salesLogisticsStatistics/saleSteelForm.vue";
-import transportationPerformance from "../components/salesLogisticsStatistics/transportationPerformance.vue";
-import purchaseChemicalMaterialsNew from "../components/purchaseChemicalMaterials/purchaseChemicalMaterialsNew.vue";
-import purchaseChemicalMaterialsOld from "../components/purchaseChemicalMaterials/purchaseChemicalMaterialsOld.vue";
-import purInwardReport from "../components/inwardReport/putInwardReport.vue";
-import inwardFactory from "../components/inwardReport/inwardFactory.vue";
-import getLoading from "../components/inwardReport/getLoading.vue";
-import getUnLoading from "../components/inwardReport/getUnLoading.vue";
-import purchaseMineral from "../components/purachaseMineral.vue";
-import inwardSporadicReport from "../components/sporadicReport/inwardSporadicReport.vue";
-import getInstall from "../components/inwardReport/getInstall.vue";
-import getCapacityByDefend from "../components/defendCapacity/getCapacityByDefend.vue";
-import inwardAssemble from "../components/inwardAssemble/inwardAssemble.vue";
-import loadCapacityDetail from "../components/loadCapacityDetail/loadCapacityDetail.vue";
-import allInwardReport from "../components/inwardReport/allInwardReport.vue";
-import saleSteelAllReport from "../components/salesLogisticsStatistics/saleSteelAllReport.vue";
-import loadWagonWorkReport from "../components/wanzhouReport/loadWagonWorkReport.vue";
-import unloadShipWorkReport from "../components/wanzhouReport/unloadShipWorkReport.vue";
-import wagonWorkReport from "../components/wanzhouReport/wagonWorkReport.vue";
-import saleSteelCarrierReport from "@/views/statisticalReport/components/salesLogisticsStatistics/saleSteelCarrierReport";
-import saleSteelReports from "@/views/statisticalReport/components/salesLogisticsStatistics/saleSteelReports";
-
-Vue.use(Router);
+import ShipDynamicTable from '../components/Ship_dynamic_table.vue'
+import ShipWorkReport from '../components/ShipWorkReport.vue'
+import dowmShipDynamicTable from '../components/dowmShipDynamicTable.vue'
+import purchaseAccessoriesMonitor from '../components/purchaseAccessoriesMonitor.vue'
+import purchasFuelOldMonitor from '../components/purchasFuelMonitor/purchasFuelOldMonitor.vue'
+import purchasFuelNewMonitor from '../components/purchasFuelMonitor/purchasFuelNewMonitor.vue'
+import sporadicReportEnterFactory from '../components/sporadicReport/sporadicReportEnterFactory.vue'
+import sporadicReportExFactory from '../components/sporadicReport/sporadicReportExFactory.vue'
+import saleChemicalCokeForm from '../components/salesLogisticsStatistics/saleChemicalCokeForm.vue'
+import saleCoproductForm from '../components/salesLogisticsStatistics/saleCoproductForm.vue'
+import saleSteelForm from '../components/salesLogisticsStatistics/saleSteelForm.vue'
+import transportationPerformance from '../components/salesLogisticsStatistics/transportationPerformance.vue'
+import purchaseChemicalMaterialsNew from '../components/purchaseChemicalMaterials/purchaseChemicalMaterialsNew.vue'
+import purchaseChemicalMaterialsOld from '../components/purchaseChemicalMaterials/purchaseChemicalMaterialsOld.vue'
+import purInwardReport from '../components/inwardReport/putInwardReport.vue'
+import inwardFactory from '../components/inwardReport/inwardFactory.vue'
+import getLoading from '../components/inwardReport/getLoading.vue'
+import getUnLoading from '../components/inwardReport/getUnLoading.vue'
+import purchaseMineral from '../components/purachaseMineral.vue'
+import inwardSporadicReport from '../components/sporadicReport/inwardSporadicReport.vue'
+import getInstall from '../components/inwardReport/getInstall.vue'
+import getCapacityByDefend from '../components/defendCapacity/getCapacityByDefend.vue'
+import inwardAssemble from '../components/inwardAssemble/inwardAssemble.vue'
+import loadCapacityDetail from '../components/loadCapacityDetail/loadCapacityDetail.vue'
+import allInwardReport from '../components/inwardReport/allInwardReport.vue'
+import saleSteelAllReport from '../components/salesLogisticsStatistics/saleSteelAllReport.vue'
+import loadWagonWorkReport from '../components/wanzhouReport/loadWagonWorkReport.vue'
+import unloadShipWorkReport from '../components/wanzhouReport/unloadShipWorkReport.vue'
+import wagonWorkReport from '../components/wanzhouReport/wagonWorkReport.vue'
+import saleSteelCarrierReport from '@/views/statisticalReport/components/salesLogisticsStatistics/saleSteelCarrierReport'
+import saleSteelReports from '@/views/statisticalReport/components/salesLogisticsStatistics/saleSteelReports'
+import mapTest from '../components/salesLogisticsStatistics/mapTest.vue'
+Vue.use(Router)
 
 const constantRouterMap = [
   {
-    path: "/",
-    name: "main",
-    meta: { title: "首页", code: "xtpzgl" },
+    path: '/',
+    name: 'main',
+    meta: { title: '首页', code: 'xtpzgl' },
     component: main,
-    redirect: { name: "cargoResult" },
+    redirect: { name: 'cargoResult' },
     children: [
       {
-        path: "purchaseChemicalMaterialsNew",
-        name: "purchaseChemicalMaterialsNew",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purchaseChemicalMaterialsNew',
+        name: 'purchaseChemicalMaterialsNew',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purchaseChemicalMaterialsNew
       },
       {
-        path: "purchaseChemicalMaterialsOld",
-        name: "purchaseChemicalMaterialsOld",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purchaseChemicalMaterialsOld',
+        name: 'purchaseChemicalMaterialsOld',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purchaseChemicalMaterialsOld
       },
       {
-        path: "ShipDynamicTable",
-        name: "ShipDynamicTable",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'ShipDynamicTable',
+        name: 'ShipDynamicTable',
+        meta: { code: 'xtpzgl-yhgl' },
         component: ShipDynamicTable
       },
       {
-        path: "ShipWorkReport",
-        name: "ShipWorkReport",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'ShipWorkReport',
+        name: 'ShipWorkReport',
+        meta: { code: 'xtpzgl-yhgl' },
         component: ShipWorkReport
       },
       {
-        path: "dowmShipDynamicTable",
-        name: "dowmShipDynamicTable",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'dowmShipDynamicTable',
+        name: 'dowmShipDynamicTable',
+        meta: { code: 'xtpzgl-yhgl' },
         component: dowmShipDynamicTable
       },
       {
-        path: "purchaseAccessoriesMonitor",
-        name: "purchaseAccessoriesMonitor",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purchaseAccessoriesMonitor',
+        name: 'purchaseAccessoriesMonitor',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purchaseAccessoriesMonitor
       },
       {
-        path: "purchasFuelOldMonitor",
-        name: "purchasFuelOldMonitor",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purchasFuelOldMonitor',
+        name: 'purchasFuelOldMonitor',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purchasFuelOldMonitor
       },
       {
-        path: "purchasFuelNewMonitor",
-        name: "purchasFuelNewMonitor",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purchasFuelNewMonitor',
+        name: 'purchasFuelNewMonitor',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purchasFuelNewMonitor
       },
       {
-        path: "sporadicReportEnterFactory",
-        name: "sporadicReportEnterFactory",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'sporadicReportEnterFactory',
+        name: 'sporadicReportEnterFactory',
+        meta: { code: 'xtpzgl-yhgl' },
         component: sporadicReportEnterFactory
       },
       {
-        path: "sporadicReportExFactory",
-        name: "sporadicReportExFactory",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'sporadicReportExFactory',
+        name: 'sporadicReportExFactory',
+        meta: { code: 'xtpzgl-yhgl' },
         component: sporadicReportExFactory
       },
       {
-        path: "saleChemicalCokeForm",
-        name: "saleChemicalCokeForm",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'saleChemicalCokeForm',
+        name: 'saleChemicalCokeForm',
+        meta: { code: 'xtpzgl-yhgl' },
         component: saleChemicalCokeForm
       },
       {
-        path: "saleCoproductForm",
-        name: "saleCoproductForm",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'saleCoproductForm',
+        name: 'saleCoproductForm',
+        meta: { code: 'xtpzgl-yhgl' },
         component: saleCoproductForm
       },
       {
-        path: "saleSteelForm",
-        name: "saleSteelForm",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'saleSteelForm',
+        name: 'saleSteelForm',
+        meta: { code: 'xtpzgl-yhgl' },
         component: saleSteelForm
       },
       {
-        path: "transportationPerformance",
-        name: "transportationPerformance",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'transportationPerformance',
+        name: 'transportationPerformance',
+        meta: { code: 'xtpzgl-yhgl' },
         component: transportationPerformance
       },
       {
-        path: "purInwardReport",
-        name: "purInwardReport",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purInwardReport',
+        name: 'purInwardReport',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purInwardReport
       },
       {
-        path: "inwardFactory",
-        name: "inwardFactory",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'inwardFactory',
+        name: 'inwardFactory',
+        meta: { code: 'xtpzgl-yhgl' },
         component: inwardFactory
       },
       {
-        path: "getLoading",
-        name: "getLoading",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'getLoading',
+        name: 'getLoading',
+        meta: { code: 'xtpzgl-yhgl' },
         component: getLoading
       },
       {
-        path: "getUnLoading",
-        name: "getUnLoading",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'getUnLoading',
+        name: 'getUnLoading',
+        meta: { code: 'xtpzgl-yhgl' },
         component: getUnLoading
       },
       {
-        path: "purchaseMineral",
-        name: "purchaseMineral",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'purchaseMineral',
+        name: 'purchaseMineral',
+        meta: { code: 'xtpzgl-yhgl' },
         component: purchaseMineral
       },
       {
-        path: "inwardSporadicReport",
-        name: "inwardSporadicReport",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'inwardSporadicReport',
+        name: 'inwardSporadicReport',
+        meta: { code: 'xtpzgl-yhgl' },
         component: inwardSporadicReport
       },
       {
-        path: "getInstall",
-        name: "getInstall",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'getInstall',
+        name: 'getInstall',
+        meta: { code: 'xtpzgl-yhgl' },
         component: getInstall
       },
       {
-        path: "getCapacityByDefend",
-        name: "getCapacityByDefend",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'getCapacityByDefend',
+        name: 'getCapacityByDefend',
+        meta: { code: 'xtpzgl-yhgl' },
         component: getCapacityByDefend
       },
       {
-        path: "inwardAssemble",
-        name: "inwardAssemble",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'inwardAssemble',
+        name: 'inwardAssemble',
+        meta: { code: 'xtpzgl-yhgl' },
         component: inwardAssemble
       },
       {
-        path: "loadCapacityDetail",
-        name: "loadCapacityDetail",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'loadCapacityDetail',
+        name: 'loadCapacityDetail',
+        meta: { code: 'xtpzgl-yhgl' },
         component: loadCapacityDetail
       },
       {
-        path: "allInwardReport",
-        name: "allInwardReport",
-        meta: { code: "xtpzgl-yhgl" },
+        path: 'allInwardReport',
+        name: 'allInwardReport',
+        meta: { code: 'xtpzgl-yhgl' },
         component: allInwardReport
       },
       {
-        path: "saleSteelAllReport",
-        name: "saleSteelAllReport",
+        path: 'saleSteelAllReport',
+        name: 'saleSteelAllReport',
         meta: {
-          code: "xtpzgl-yhgl"
+          code: 'xtpzgl-yhgl'
         },
         component: saleSteelAllReport
       },
       {
-        path: "loadWagonWorkReport",
-        name: "loadWagonWorkReport",
+        path: 'loadWagonWorkReport',
+        name: 'loadWagonWorkReport',
         meta: {
-          code: "xtpzgl-yhgl"
+          code: 'xtpzgl-yhgl'
         },
         component: loadWagonWorkReport
       },
       {
-        path: "unloadShipWorkReport",
-        name: "unloadShipWorkReport",
+        path: 'unloadShipWorkReport',
+        name: 'unloadShipWorkReport',
         meta: {
-          code: "xtpzgl-yhgl"
+          code: 'xtpzgl-yhgl'
         },
         component: unloadShipWorkReport
       },
       {
-        path: "wagonWorkReport",
-        name: "wagonWorkReport",
+        path: 'wagonWorkReport',
+        name: 'wagonWorkReport',
         meta: {
-          code: "xtpzgl-yhgl"
+          code: 'xtpzgl-yhgl'
         },
         component: wagonWorkReport
       },
       {
-        path: "saleSteelCarrierReport",
-        name: "saleSteelCarrierReport",
+        path: 'saleSteelCarrierReport',
+        name: 'saleSteelCarrierReport',
         meta: {
-          code: "xtpzgl-yhgl"
+          code: 'xtpzgl-yhgl'
         },
         component: saleSteelCarrierReport
       },
       {
-        path: "saleSteelReports",
-        name: "saleSteelReports",
+        path: 'saleSteelReports',
+        name: 'saleSteelReports',
         meta: {
-          code: "xtpzgl-yhgl"
+          code: 'xtpzgl-yhgl'
         },
         component: saleSteelReports
+      },
+      {
+        path: 'mapTest',
+        name: 'mapTest',
+        meta: {
+          code: 'xtpzgl-yhgl'
+        },
+        component: mapTest
       }
     ]
   }
-];
+]
 const router = new Router({
   routes: constantRouterMap
-});
+})
 //  before
-routerBefore(router, constantRouterMap);
+routerBefore(router, constantRouterMap)
 
-export default router;
+export default router
 //  constantRouterMap
-export const routes = constantRouterMap;
+export const routes = constantRouterMap