xianniu-ui 0.6.3 → 0.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xianniu-ui",
-  "version": "0.6.3",
+  "version": "0.7.0",
   "private": false,
   "main": "lib/xianniu-ui.umd.min.js",
   "scripts": {

package/packages/card/index.js

@@ -0,0 +1,7 @@
+import XnCard from './main.vue'
+
+XnCard.install = function (Vue) {
+  Vue.component(XnCard.name, XnCard)
+}
+
+export default XnCard

package/packages/card/main.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="xn-card">
+    <div class="xn-card-header flex justify-content-between">
+      <slot name="title" v-if="title">
+        <slot name="title">
+          <h3><span>{{title}}</span></h3>
+        </slot>
+      </slot>
+      <div class="xn-card-header__more">
+        <slot name="more"></slot>
+      </div>
+    </div>
+    <div class="xn-card-body" :style="styles">
+      <slot></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "XnCard",
+  props: {
+    title: {
+      type: String,
+      default: "",
+    },
+    bodyStyle: {
+      type: Object,
+      default: () => {
+        return {
+          padding: "18px",
+        };
+      },
+    },
+  },
+  computed: {
+    styles() {
+      return {
+        ...this.bodyStyle,
+      };
+    },
+  },
+};
+</script>
+
+<style>
+</style>

package/packages/city/main.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script>
-const ZXCITY = ['北京市','天津市','上海市','重庆市']
+const ZXCITY = ["北京市", "天津市", "上海市", "重庆市"];
 import citys from "xn-ui/src/area/index.js";
 export default {
   name: "XnCity",
@@ -251,19 +251,24 @@ export default {
     getCity(data, nameList) {
       if (nameList.length === 0) return [];
       const [cityName, ...rest] = nameList;
-      const item = data.find((i) => i.cityName === cityName || i.cityName.indexOf(cityName.substring(0,2)) > -1);
-      if(item){
+      const item =
+        data &&
+        data.find((i) => i.cityName === cityName || cityName.indexOf(i.cityName) > -1);
+      if (item) {
         return [item.cityCode, ...this.getCity(item.subCitys, rest)];
-      }else{
-        return [...this.getCity([], rest)]
+      } else {
+        return [...this.getCity([], rest)];
       }
     },
     str2Code(val) {
       if (!val) return;
+      val = val.replace(/[^\u4e00-\u9fa5]/g, "");
       const cityArr = val.match(this.$reg.getCity) || [];
-      const newarr = cityArr.length&&cityArr.map((item,idx,arr)=>{
-        return ZXCITY.includes(item) && idx === 0 ? [item,...arr] : arr
-      })[0]
+      const newarr =
+        cityArr.length &&
+        cityArr.map((item, idx, arr) => {
+          return ZXCITY.includes(item) && idx === 0 ? [item, ...arr] : arr;
+        })[0];
       const arr = this.getCity(this.cityList, newarr);
       return arr[arr.length - 1];
     },

package/packages/search/main.vue

@@ -1,6 +1,13 @@
 <template>
   <div class="xn-search">
-    <el-form ref="form" inline :model="form" :label-width="labelWidth">
+    <el-form
+      ref="form"
+      inline
+      :model="form"
+      :label-width="labelWidth"
+      @submit.native.prevent
+      @keyup.enter.native="onSearch"
+    >
       <el-row :gutter="0" class="xn-search--row">
         <template v-for="(item, idx) in form.value">
           <el-col v-bind="{ ...col }" :key="idx" v-show="item.isShow || isColl">
@@ -16,6 +23,7 @@
                 :data-level="(item.options && item.options.dataLevel) || 2"
                 v-model="item.modelVal"
                 @on-city="handleChangeCity"
+                
               />
             </el-form-item>
             <el-form-item
@@ -53,6 +61,7 @@
                 :reserve-keyword="isRemote(item.remote)"
                 :default-first-option="isRemote(item.remote)"
                 :remote-method="item.remote"
+                
               >
                 <el-option
                   v-for="(itemData, idxData) in item.data"
@@ -302,12 +311,12 @@ export default {
     setValue(key, value) {
       if (Object.prototype.toString.call(key) === "[object Object]") {
         const list = this.form.value;
-        const keys = Object.keys(key)
+        const keys = Object.keys(key);
         for (let i = 0; i < list.length; i++) {
           const item = list[i];
-          if(keys.includes(item.prop)){
-            console.log(item,key[item.prop]);
-            item.modelVal = key[item.prop]
+          if (keys.includes(item.prop)) {
+            console.log(item, key[item.prop]);
+            item.modelVal = key[item.prop];
           }
         }
         return;

package/packages/style/src/card.scss

@@ -0,0 +1,16 @@
+.xn-card {
+    background-color: #fff;
+    padding: 0 38px;
+    &-header {
+        padding: 24px 0 13px 0;
+        border-bottom: 1px solid #f2f2f2;
+        h3 {
+            margin: 0;
+            padding: 0;
+            font-size: 18px;
+            font-weight: 500;
+            color: #202131;
+            line-height: 25px;
+        }
+    }
+}

package/packages/style/src/index.scss

@@ -12,6 +12,7 @@
 @import './footer.scss';
 @import './tag.scss';
 @import './ellipsis.scss';
+@import './card.scss';
 
 
 
@@ -19,4 +20,5 @@
 @import './theme/variables.scss';
 @import './theme/mixin.scss';
 @import './theme/transition.scss';
-@import './theme/sidebar.scss';
+@import './theme/sidebar.scss';
+@import './theme/element-ui.scss';

package/packages/style/src/theme/element-ui.scss

@@ -0,0 +1,8 @@
+.el-descriptions{
+    .el-descriptions-item__label:not(.is-bordered-label){
+        color: #909097;
+    }
+    &--small{
+        font-size: 14px;
+    }
+}

package/packages/table/main.vue

@@ -116,7 +116,7 @@
       </el-table-column>
       <el-table-column
         width="50px"
-        label="No."
+        label="序号"
         v-if="index && data.length"
         type="index"
       ></el-table-column>

package/packages/tree/main.vue

@@ -61,7 +61,7 @@ export default {
       if (
         data.parentId &&
         data.parentId !== 0 &&
-        !data[this.defaultProps.children].length
+        (data[this.defaultProps.children] && !data[this.defaultProps.children].length)
       ) {
         className = 'especially'
       }

package/packages/upload/main.vue

@@ -277,21 +277,7 @@ export default {
     },
     async handleDownload(file) {
       const { url, name } = file;
-      const x = new XMLHttpRequest();
-      x.open("GET", url, true);
-      x.responseType = "blob";
-      x.onload = function () {
-        const _url = window.URL.createObjectURL(x.response);
-        const elt = document.createElement("a");
-        elt.setAttribute("href", _url);
-        elt.setAttribute("download", name);
-        elt.style.display = "none";
-        elt.target = "_blank";
-        document.body.appendChild(elt);
-        elt.click();
-        document.body.removeChild(elt);
-      };
-      x.send();
+      return this.$utils.download({url, name})
     },
     handleRemove(file, fileList) {
       fileList.forEach((item, idx) => {

package/src/index.js

@@ -15,6 +15,7 @@ import XnFooter from '../packages/footer/index'
 import XnEmpty from '../packages/empty/index'
 import XnTag from '../packages/tag/index'
 import XnEllipsis from '../packages/ellipsis/index'
+import XnCard from '../packages/card/index'
 
 import Utils from 'xn-ui/src/utils/index'
 const doc = 'http://lzwr.gitee.io/xn-ui/#/'
@@ -34,7 +35,8 @@ const components = [
     XnFooter,
     XnEmpty,
     XnTag,
-    XnEllipsis
+    XnEllipsis,
+    XnCard
 ]
 const version = require('../package.json').version
 const install = function (Vue) {
@@ -80,5 +82,6 @@ export default {
     XnFooter,
     XnEmpty,
     XnTag,
-    XnEllipsis
+    XnEllipsis,
+    XnCard
 }

package/src/utils/utils.js

@@ -65,27 +65,23 @@ const download = (params = { name: '', url: '' }) => {
     name: '下载模板'
   }
   const _params = Object.assign(defaultParams, params)
+  console.log('_params: ', _params);
   const { url, name } = _params
-  var x = new XMLHttpRequest()
-  x.open('GET', url, true)
-  // x.responseType = 'blob'
-  // x.responseType = 'blob'
-  x.onprogress = function () {
-  }
+  const x = new XMLHttpRequest();
+  x.open("GET", url, true);
+  x.responseType = "blob";
   x.onload = function () {
-    var _url = ''
-    try {
-      _url = window.URL.createObjectURL(x.response)
-    } catch (error) {
-      _url = url
-    }
-    var a = document.createElement('a')
-    a.href = _url
-    a.target = '_blank'
-    a.download = name
-    a.click()
-  }
-  x.send()
+    const _url = window.URL.createObjectURL(x.response);
+    const elt = document.createElement("a");
+    elt.setAttribute("href", _url);
+    elt.setAttribute("download", name);
+    elt.style.display = "none";
+    elt.target = "_blank";
+    document.body.appendChild(elt);
+    elt.click();
+    document.body.removeChild(elt);
+  };
+  x.send();
 }
 /**
  * 根据某个key 对数组去重合并
@@ -97,7 +93,7 @@ const arrMerge = (arr = [], key = '') => {
   if (!key) {
     throw new Error('error arguments: key is required')
   }
-  if(!arr.length) return
+  if (!arr.length) return
   var map = {}; var result = []
 
   for (var i = 0; i < arr.length; i++) {