Loading: improve visual, add custom text

packages/loading/src/directive.js

@@ -1,4 +1,6 @@
-import Spinner from './spinner';
+import Vue from 'vue';
+let Spinner = Vue.extend(require('./spinner.vue'));
+
 exports.install = Vue => {
   let toggleLoading = (el, binding) => {
     if (binding.value) {
@@ -88,11 +90,18 @@ exports.install = Vue => {
       el.maskStyle = {
         position: 'absolute',
         zIndex: '10000',
-        backgroundColor: 'rgba(0, 0, 0, .65)',
+        backgroundColor: 'rgba(255, 255, 255, .9)',
         margin: '0'
       };
 
-      el.spinner = (new Spinner()).el;
+      let spinner = new Spinner({
+        data: {
+          text: el.getAttribute('element-loading-text'),
+          fullScreen: !!binding.modifiers.fullscreen
+        }
+      });
+      spinner.$mount(el.mask);
+      el.spinner = spinner.$el;
       el.spinnerStyle = {
         position: 'absolute'
       };