Merge pull request #1 from WeBankFinTech/master

merge

Author: xtt55

.eslintrc.js

@@ -1,69 +1,69 @@
 module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  'extends': [
-    'plugin:vue/essential',
-    '@vue/standard'
-  ],
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'key-spacing': ['error'],
-    'keyword-spacing': ['error'],
-    'standard/no-callback-literal': 0,
-    'handle-callback-err': 0,
-    'no-return-assign': 0,
-    'eqeqeq': 0,
-    'comma-dangle': 0,
-    'semi': 0,
-    'space-before-function-paren': 0,
-    'keyword-spacing': 0,
-    'no-useless-escape': 0,
-    'no-invalid-this': 0,
-    'operator-linebreak': 0,
-    'indent': [
-        'error',
-        4,
-        {
-            'SwitchCase': 1
-        }
+    root: true,
+    env: {
+        node: true
+    },
+    'extends': [
+        'plugin:vue/essential',
+        '@vue/standard'
     ],
-    'no-const-assign': 'warn',
-    'no-this-before-super': 'warn',
-    'no-undef': 2,
-    'no-unreachable': 'warn',
-    'no-unused-vars': 'warn',
-    'constructor-super': 'warn',
-    'valid-typeof': 'warn',
-    'one-var': 'warn',
-    'max-len': 'off',
-    'no-trailing-spaces': 'off',
-    'require-jsdoc': 'warn',
-    'camelcase': 'warn',
-    'no-invalid-this': 'warn',
-    'linebreak-style': 0,
-    'vue/no-parsing-error': [2, {
-        'x-invalid-end-tag': false,
-        'invalid-first-character-of-tag-name': false
-    }],
-    'no-tabs': 0,
-    'vue/html-indent': [2, 2, {
-        'attribute': 1,
-        'closeBracket': 0,
-        'alignAttributesVertically': false
-    }],
-    'vue/require-default-prop': 0,
-    'vue/component-name-in-template-casing': 0,
-    'vue/html-closing-bracket-spacing': 0,
-    'vue/html-closing-bracket-newline': 0,
-    'vue/singleline-html-element-content-newline': 0,
-    'vue/multiline-html-element-content-newline': 0,
-    'vue/attributes-order': 0,
-    'vue/html-self-closing': 0
-  },
-  parserOptions: {
-    parser: 'babel-eslint'
-  }
+    rules: {
+        'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+        'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+        'key-spacing': ['error'],
+        'keyword-spacing': ['error'],
+        'standard/no-callback-literal': 0,
+        'handle-callback-err': 0,
+        'no-return-assign': 0,
+        'eqeqeq': 0,
+        'comma-dangle': 0,
+        'semi': 0,
+        'space-before-function-paren': 0,
+        'keyword-spacing': 0,
+        'no-useless-escape': 0,
+        'no-invalid-this': 0,
+        'operator-linebreak': 0,
+        'indent': [
+            'error',
+            4,
+            {
+                'SwitchCase': 1
+            }
+        ],
+        'no-const-assign': 'warn',
+        'no-this-before-super': 'warn',
+        'no-undef': 2,
+        'no-unreachable': 'warn',
+        'no-unused-vars': 'warn',
+        'constructor-super': 'warn',
+        'valid-typeof': 'warn',
+        'one-var': 'warn',
+        'max-len': 'off',
+        'no-trailing-spaces': 'off',
+        'require-jsdoc': 'warn',
+        'camelcase': 'warn',
+        'no-invalid-this': 'warn',
+        'linebreak-style': 0,
+        'vue/no-parsing-error': [2, {
+            'x-invalid-end-tag': false,
+            'invalid-first-character-of-tag-name': false
+        }],
+        'no-tabs': 0,
+        'vue/html-indent': [2, 2, {
+            'attribute': 1,
+            'closeBracket': 0,
+            'alignAttributesVertically': false
+        }],
+        'vue/require-default-prop': 0,
+        'vue/component-name-in-template-casing': 0,
+        'vue/html-closing-bracket-spacing': 0,
+        'vue/html-closing-bracket-newline': 0,
+        'vue/singleline-html-element-content-newline': 0,
+        'vue/multiline-html-element-content-newline': 0,
+        'vue/attributes-order': 0,
+        'vue/html-self-closing': 0
+    },
+    parserOptions: {
+        parser: 'babel-eslint'
+    }
 }

README.md

@@ -9,6 +9,8 @@ Scriptis
 
 Scriptis is for interactive data analysis with script development(SQL, Pyspark, HiveQL), task submission(Spark, Hive), UDF, function, resource management and intelligent diagnosis.
 
+![运行时功能](docs/zh_CN/images/readme/running.gif)
+
 ## Features
 
 * Script editor: Support multi-language, auto-completion, syntax highlighting and SQL syntax error-correction.

babel.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-  presets: [
-    '@vue/app'
-  ]
+    presets: [
+        '@vue/app'
+    ]
 }

docs/zh_CN/README.md

@@ -7,7 +7,7 @@ Scriptis
 
 ## 引言：
 
-Scriptis是一款支持写SQL、Pyspark、HiveQL等脚本，提交给Spark、Hive和Python等计算引擎执行的交互式数据分析Web工具，且支持UDF、函数、资源管控和智能诊断等企业级特性。
+Scriptis是一款支持在线写SQL、Pyspark、HiveQL等脚本，提交给**Linkis**（Linkis是什么？[点我了解](https://github.com/WeBankFinTech/Linkis/blob/master/docs/zh_CN/README.md)）执行的数据分析Web工具，且支持UDF、函数、资源管控和智能诊断等企业级特性。
 
 ----
 
@@ -48,4 +48,4 @@ Scriptis是一款支持写SQL、Pyspark、HiveQL等脚本，提交给Spark、Hiv
 * [部署手册](ch1/前台部署文档.md)
 * [前台编译手册](ch2/编译文档.md)
 * [快速使用手册](ch3/scriptis快速使用文档.md)
-* [使用手册](ch4/Scriptis使用手册.md)
+* [使用手册](ch4/Scriptis使用手册.md)

package.json

@@ -25,7 +25,7 @@
     "sql-formatter": "^2.1.0",
     "vue": "^2.6.6",
     "vue-router": "^3.0.1",
-    "vuescroll": "^4.10.5"
+    "vuescroll": "^4.13.1"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^3.8.0",

postcss.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-  plugins: {
-    autoprefixer: {}
-  }
+    plugins: {
+        autoprefixer: {}
+    }
 }

src/js/component/panel/panel.vue

@@ -103,7 +103,7 @@ export default {
                     }
                 });
                 this.items.forEach((element) => {
-                    if (!element.width) {
+                    if (element && !element.width) {
                         element.currentWidth = this.readyToAllocationWidth / this.readyToAllocationItemLength;
                     }
                 });

src/js/component/table/index.scss

@@ -8,6 +8,8 @@ $border-color          : #e0e0e0;
     }
 }
 .we-table-header{
+    height: 40px;
+    line-height: 40px;
     background-color: rgb(94, 157, 224);
     color: #fff;
     ul{
@@ -22,6 +24,22 @@ $border-color          : #e0e0e0;
         }
     }
 }
+.list-header .list-view-item{
+    color: #fff;
+    border-right: 1px solid #e8eaec;
+}
+.we-column-item{
+    border-right: 1px solid #e8eaec;
+    &.null-text {
+        color: #ed4014;
+    }
+    &.active {
+        background-color: #ebf7ff;
+    }
+}
+.header-list::-webkit-scrollbar{
+    display: none;
+}
 .caret-wrapper{
     display: -ms-inline-flexbox;
     display: inline-flex;
@@ -40,7 +58,11 @@ $border-color          : #e0e0e0;
     position: absolute;
     top: 0;
     left:0px;
-    overflow: hidden;
+    width: 100%;
+    height: 100%;
+}
+.we-table-body{
+    height: calc(100% - 40px);
 }
 .we-table-sort-caret{
     width: 0;

src/js/component/table/list.vue

@@ -2,7 +2,7 @@
   <div
     class="list-view"
     ref="list">
-    <vue-scroll
+    <vuescroll
       :ops="ops"
       @handle-scroll="handleScroll">
       <list-body
@@ -24,15 +24,15 @@
           </div>
         </div>
       </list-body>
-    </vue-scroll>
+    </vuescroll>
   </div>
 </template>
 <script>
 import listBody from './body.vue';
-import vueScroll from './vuescroll/vuescroll-native.js';
+import vuescroll from 'vuescroll/dist/vuescroll-native';
 export default {
     components: {
-        vueScroll,
+        vuescroll,
         listBody,
     },
     props: {