Merge pull request #541 from DaoCloud/release/1.0.7

Release/1.0.7
DaoCloud · Aug 16, 2018 · 630f069 · 630f069
2 parents be3c6c2 + ce740f6
commit 630f069
Show file tree

Hide file tree

Showing 11 changed files with 604 additions and 540 deletions.
diff --git a/changelogs/v1.0.7.md b/changelogs/v1.0.7.md
@@ -0,0 +1,22 @@
+<a name="1.0.7"></a>
+# 1.0.7 (2018-08-16)
+
+
+## Bug Fixes
+
+- **EditableTable:**
+  - 判断逻辑出错
+  ([d601e39c](https://github.com/DaoCloud/dao-style-vue/commit/d601e39cf3885ab4cbf499a57ef889de2a3b9acf))
+  - default 是 false 时不生效
+  ([60371611](https://github.com/DaoCloud/dao-style-vue/commit/60371611cc1a4ab78ba6cc9140d8b355bde17220))
+  - select 为 Boolean 时会出错
+  ([2c5f9e99](https://github.com/DaoCloud/dao-style-vue/commit/2c5f9e996b05f7f2be16587dc45cdf1b329f4151))
+
+
+## Features
+
+- **DCE-9649:** dao-setting-layout分割线前留白
+  ([4ab4c959](https://github.com/DaoCloud/dao-style-vue/commit/4ab4c959b4ea81b42bdf6a48b624c36dae98fe23))
+- **dao-dropdown:** dao-dropdown 支持外部控制显示与否
+  ([6c504f54](https://github.com/DaoCloud/dao-style-vue/commit/6c504f547be991ff71cfca56598df790f5f27b96))
+
diff --git a/dist/dao-style.min.js b/dist/dao-style.min.js
diff --git a/dist/styles/dao-style.css b/dist/styles/dao-style.css
diff --git a/docs/dao-dropdown.md b/docs/dao-dropdown.md
@@ -33,6 +33,7 @@ dropdown 是一个下拉菜单组件。代码请参照目录：[src/components/d
 参数 | 说明 | 类型 | 可选值 | 默认值 | 是否必填
 -|-|-|-|-|-
 trigger | 触发方式 | String | click, hover, custom | hover | 否
+show | 是否打开 dropdown(仅在 trigger 为 custom 时生效) | Boolean | true, false | false | 否
 append-to-body | 是否将下拉菜单挂 DOM 元素载到 body | Boolean | true, false | true |否
 placement | 设置下拉菜单的相对位置 | String | (top\|bottom\|left\|right\|auto)(-start\|-end) | bottom |否
 

diff --git a/examples/routers/dropdown.vue b/examples/routers/dropdown.vue
@@ -57,10 +57,10 @@
 
     <dao-dropdown
       trigger="custom"
-      :append-to-body="false"
-      :visible="true"
+      :append-to-body="true"
+      :show="show"
       :placement="placement">
-      <button class="dao-btn blue">
+      <button class="dao-btn blue" @click="show = !show">
         下拉菜单
       </button>
       <dao-dropdown-menu slot="list">
@@ -100,6 +100,7 @@
     data() {
       return {
         placement: 'bottom-start',
+        show: true,
       };
     },
     methods: {

diff --git a/src/components/dao-dropdown/dao-dropdown.vue b/src/components/dao-dropdown/dao-dropdown.vue
@@ -1,10 +1,21 @@
 <template>
-  <div :class="[prefixCls, {'dao-dropdown-is-open': visible}]" v-clickoutside:dao-select-dropdown="handleClose" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave">
-    <div :class="[prefixCls + '-rel']" ref="reference" @click="handleClick">
+  <div
+    :class="[prefixCls, {'dao-dropdown-is-open': visible}]"
+    v-clickoutside:dao-select-dropdown="handleClose"
+    @mouseenter="handleMouseenter"
+    @mouseleave="handleMouseleave">
+    <div
+      :class="[prefixCls + '-rel']"
+      ref="reference"
+      @click="handleClick">
       <slot></slot>
     </div>
-    <div :class="[prefixCls + '-popper', 'dao-select-dropdown']" v-show="visible" ref="popper">
-      <div :class="[prefixCls + '-inner']">
+    <div
+      :class="[prefixCls + '-popper', 'dao-select-dropdown']"
+      v-show="visible"
+      ref="popper">
+      <div
+        :class="[prefixCls + '-inner']">
         <slot name="list"></slot>
       </div>
     </div>
@@ -29,10 +40,15 @@
         },
         default: 'hover',
       },
+      show: {
+        type: Boolean,
+        default: false,
+      },
     },
     data() {
       return {
         prefixCls,
+        unwatch: null,
       };
     },
     methods: {
@@ -105,6 +121,15 @@
           li.addEventListener('click', this.handleClose);
         });
       }
+      if (this.trigger === 'custom') {
+        this.unwatch = this.$watch('show', () => {
+          setTimeout(() => {
+            this.visible = !!this.show;
+          }, 0);
+        }, {
+          immediate: true,
+        });
+      }
     },
     beforeDestroy() {
       if (this.appendToBody) {
@@ -114,6 +139,9 @@
           li.removeEventListener('click', this.handleClose);
         });
       }
+      if (this.unwatch) {
+        this.unwatch();
+      }
     },
   };
 </script>

diff --git a/src/components/dao-editable-table/dao-editable-table.html b/src/components/dao-editable-table/dao-editable-table.html
@@ -38,7 +38,7 @@
             v-model="td.value"
             size="sm"
             @change="validteAndUpdate()">
-            <dao-option v-for="option in td.options" :value="option.value || option" :label="option.label || option" :key="option.value || option"></dao-option>
+            <dao-option v-for="option in td.options" :value="getOptionProp(option, 'value')" :label="getOptionProp(option, 'label')" :key="option.value || option"></dao-option>
           </dao-select>
           <span v-if="td.type === 'text'">{{ td.value }}</span>
         </td>

diff --git a/src/components/dao-editable-table/dao-editable-table.js b/src/components/dao-editable-table/dao-editable-table.js
@@ -5,6 +5,7 @@ import {
   _forEach,
   _some,
   _isString,
+  _isObject,
 } from '../../utils/assist';
 
 export default {
@@ -67,7 +68,7 @@ export default {
         switch (td.type) {
           case 'input':
           case 'select':
-            value = td.default || '';
+            value = td.default;
             break;
           case 'checkbox':
             value = td.default || false;
@@ -163,6 +164,12 @@ export default {
       this.validate();
       this.updateModel();
     },
+    getOptionProp(option, prop) {
+      if (!_isObject(option)) {
+        return option;
+      }
+      return option[prop];
+    },
   },
   created() {
     this.modelToRow(this.value);

diff --git a/src/components/dao-setting-layout/dao-setting-layout.scss b/src/components/dao-setting-layout/dao-setting-layout.scss
@@ -11,7 +11,8 @@ $background-color-title: $white-light;
 $background-color-footer: $white-lighter;
 $padding-layout-title: 25px 20px 0;
 $padding-layout-footer: 20px;
-$padding-section: 30px 20px;
+$padding-section-left: 20px;
+$padding-section: 25px $padding-section-left;
 $font-size-1: 18px;
 $font-size-2: 16px;
 $font-size-3: 14px;
@@ -78,7 +79,7 @@ $border-radius-size: 4px;
         width: 100%;
         margin: 10px 0 0;
         border: none;
-        background: linear-gradient(to right, $background-color-title 0, $border-color 30px, $border-color calc(100% - 30px), $background-color-title 100%);
+        background: linear-gradient(to right, transparent $padding-section-left, $border-color 0);
         height: 1px;
         // 不要使用 transform 去移动，在chrome30 下会失效
         left: 0px;
@@ -87,7 +88,10 @@ $border-radius-size: 4px;
 
     // select all .dao-setting-section except the first one
     & ~ .dao-setting-section {
-      border-top: $border;
+      border-top: 1px solid transparent;
+      background: linear-gradient(white, white) padding-box,
+                  linear-gradient(to right, white $padding-section-left, transparent 0) border-box,
+                  linear-gradient($border-color $padding-section-left, transparent 0) border-box;
     }
   }
 
@@ -102,7 +106,7 @@ $border-radius-size: 4px;
       color: $font-color-light;
     }
     + div.dao-setting-item {
-      margin-top: 40px;
+      margin-top: 36px;
     }
   }
   &-item {

diff --git a/src/utils/assist.js b/src/utils/assist.js
@@ -5,6 +5,7 @@ export { default as _find } from 'lodash/find';
 export { default as _isBoolean } from 'lodash/isBoolean';
 export { default as _isFunction } from 'lodash/isFunction';
 export { default as _isEqual } from 'lodash/isEqual';
+export { default as _isObject } from 'lodash/isObject';
 export { default as _cloneDeep } from 'lodash/cloneDeep';
 export { default as _some } from 'lodash/some';
 export { default as _forEach } from 'lodash/forEach';

diff --git a/version.js b/version.js
@@ -1,6 +1,6 @@
 /* eslint-disable */
 // this version shows current version of project
-var VERSION = '1.0.6';
+var VERSION = '1.0.7';
 module.exports = { VERSION: VERSION };
 // ’make release‘ 依赖 console.log 把打印到标准输出, 不可删除
 console.log(VERSION);