Merge pull request #27 from eyunhua/master

v0.4.0-dev
ecomfe · Mar 12, 2018 · 5999443 · 5999443
2 parents 401ce20 + 0745fa7
commit 5999443
Show file tree

Hide file tree

Showing 24 changed files with 417 additions and 203 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,19 @@
+## 0.4.0-dev
+
+### 💡 主要变更
+
+* [+] 新增 `Calendar` 组件样式。
+* [+] 新增 ` Radio` 组件样式。
+* [+] 新增 ` Steps` 组件样式。
+* [+] 新增 ` Searchbox` 组件样式。
+* [+] `CheckboxGroup` 组件demo增加small、large类型样式。
+* [^] 更新 `RadioGroup` 组件demo
+
+### 🐞 问题修复
+
+* [^] 修复 `pagination` 组件按钮默认无背景色问题。
+* [^] 修复 `checkbox` 组件默认样式和large样式不符合规范问题
+
 ## 0.3.0-dev
 
 ### 💡 主要变更

diff --git a/demo/App.vue b/demo/App.vue
@@ -3,7 +3,13 @@
  <nav id="main-nav">
  <h1><a href="https://github.com/ecomfe/veui">VEUI components</a><icon name="github" scale="6"></icon></h1>
  <ul>
- <li v-for="(route, index) in routes" :key="index"><router-link :to='route'>{{route.name}}</router-link></li>
+ <li v-for="(route, index) in routes" :key="index">
+ <router-link :to='route'>{{route.name}}
+ <span v-if="route.isComplete === true" class="red">(ok)</span>
+ <span v-if="route.isComplete === 'noDev'" class="gray">(暂不开发)</span>
+ <span v-if="route.isComplete === 'noUi'" class="orange">(无ui)</span>
+ </router-link>
+ </li>
  </ul>
  <footer><a href="https://www.baidu.com/" target="_blank">© {{year}} Baidu, Inc.</a><icon name="baidu" scale="8"></icon></footer>
  </nav>
@@ -124,6 +130,15 @@ export default {
  &:hover {
  font-weight: 500;
  }
+ .gray {
+ color: #333;
+ }
+ .red {
+ color: #ff0000;
+ }
+ .orange {
+ color: #FF701A;
+ }
  }
  }
 
@@ -195,6 +210,7 @@ main {
  color: #666;
  border: 1px solid #d9d9d9;
  padding: 10px;
+ background: @veui-light-gray-color5;
 }
 .attrTab {
  .veui-table td {

diff --git a/demo/components/Calendar.vue b/demo/components/Calendar.vue
@@ -78,7 +78,7 @@ export default {
 
  .veui-calendar {
  float: left;
- margin-right: 10px;
+ margin: 10px;
 
  &-weekend:not(.veui-calendar-selected) {
  button {

diff --git a/demo/components/CheckboxGroup.vue b/demo/components/CheckboxGroup.vue
@@ -1,18 +1,36 @@
 <template>
  <article>
  <h1><code>&lt;veui-checkbox-group&gt;</code></h1>
+ <p>
+ <span class="veui-font-level-1b">默认图标：</span>
+ <span class="veui-font-level-2d">不传ui(大小为14px)--同checkbox组件</span>
+ </p>
  <p>
  <veui-checkbox-group :items="data1" v-model="picked1">
  <template slot-scope="props">{{ props.label }}</template>
  </veui-checkbox-group>
  </p>
  <p>value: {{ picked1 }}</p>
+ <p>
+ <span class="veui-font-level-1b">小图标：</span>
+ <span class="veui-font-level-2d">ui="small"(大小为12px)--同checkbox组件</span>
+ </p>
  <p>
  <veui-checkbox-group :items="data2" ui="small" v-model="picked2">
  <template slot-scope="props">{{ props.label }}</template>
  </veui-checkbox-group>
  </p>
  <p>value: {{ picked2 }}</p>
+ <p>
+ <span class="veui-font-level-1b">大图标：</span>
+ <span class="veui-font-level-2d">ui="big"(大小为16px)--同checkbox组件</span>
+ </p>
+ <p>
+ <veui-checkbox-group :items="data3" v-model="picked3" ui="large">
+ <template slot-scope="props">{{ props.label }}</template>
+ </veui-checkbox-group>
+ </p>
+ <p>value: {{ picked3 }}</p>
  </article>
 </template>
 
@@ -28,6 +46,7 @@ export default {
  return {
  picked1: ['Hirasawa Yui', 'Akiyama Mio'],
  picked2: [],
+ picked3: [],
  data1: [
  {
  value: 'Hirasawa Yui', label: 'Hirasawa Yui'
@@ -49,6 +68,17 @@ export default {
  {
  value: 'Nakano Azusa', label: 'Nakano Azusa'
  }
+ ],
+ data3: [
+ {
+ value: 'Hirasawa Yui', label: 'Hirasawa Yui'
+ },
+ {
+ value: 'Akiyama Mio', label: 'Akiyama Mio'
+ },
+ {
+ value: 'Nakano Azusa', label: 'Nakano Azusa'
+ }
  ]
  }
  }

diff --git a/demo/components/Radio.vue b/demo/components/Radio.vue
@@ -4,27 +4,18 @@
  <p>
  <veui-radio name="a" value="normal" v-model="a1">正常状态</veui-radio>
  </p>
- <p>
- <veui-radio name="a" value="small" ui="small" v-model="a2">正常状态</veui-radio>
- </p>
  <p>
  <veui-radio checked>选中状态</veui-radio>
  </p>
- <p>
- <veui-radio ui="small" checked>选中状态</veui-radio>
- </p>
- <p>
+ <!-- <p>
  <veui-radio checked disabled>选中无效状态</veui-radio>
- </p>
+ </p> -->
  <p>
- <veui-radio ui="small" checked disabled>选中无效状态</veui-radio>
+ <veui-radio disabled v-model="a2">选中无效状态</veui-radio>
  </p>
  <p>
  <veui-radio disabled>未选无效状态</veui-radio>
  </p>
- <p>
- <veui-radio ui="small" disabled>未选无效状态</veui-radio>
- </p>
  </article>
 </template>
 
@@ -39,7 +30,7 @@ export default {
  data () {
  return {
  a1: false,
- a2: false
+ a2: true
  }
  }
 }

diff --git a/demo/components/RadioGroup.vue b/demo/components/RadioGroup.vue
@@ -7,12 +7,6 @@
  </veui-radio-group>
  </p>
  <p>value: {{ picked1 }}</p>
- <p>
- <veui-radio-group :items="data2" ui="small" v-model="picked2">
- <template slot-scope="props">{{ props.label }}</template>
- </veui-radio-group>
- </p>
- <p>value: {{ picked2 }}</p>
  </article>
 </template>
 
@@ -27,7 +21,6 @@ export default {
  data () {
  return {
  picked1: null,
- picked2: 'Nakano Azusa',
  data1: [
  {
  value: 'Hirasawa Yui', label: 'Hirasawa Yui'
@@ -38,17 +31,6 @@ export default {
  {
  value: 'Nakano Azusa', label: 'Nakano Azusa'
  }
- ],
- data2: [
- {
- value: 'Hirasawa Yui', label: 'Hirasawa Yui'
- },
- {
- value: 'Akiyama Mio', label: 'Akiyama Mio'
- },
- {
- value: 'Nakano Azusa', label: 'Nakano Azusa'
- }
  ]
  }
  }

diff --git a/demo/components/Searchbox.vue b/demo/components/Searchbox.vue
@@ -3,12 +3,38 @@
  <h1><code>&lt;veui-searchbox&gt;</code></h1>
  <section>
  <h2>普通</h2>
+ <p>
+ <span class="veui-font-level-1b">小尺寸：</span>
+ <span class="veui-font-level-2d">ui="small"</span>
+ </p>
+ <p>
+ <veui-searchbox
+ ui="small"
+ :name="name"
+ :placeholder="placeholder"
+ @search="log($event)"></veui-searchbox>
+ </p>
+ <p>
+ <span class="veui-font-level-1b">默认尺寸：</span>
+ <span class="veui-font-level-2d">不传ui</span>
+ </p>
  <p>
  <veui-searchbox
  :name="name"
  :placeholder="placeholder"
  @search="log($event)"></veui-searchbox>
  </p>
+ <p>
+ <span class="veui-font-level-1b">大尺寸：</span>
+ <span class="veui-font-level-2d">ui="large"</span>
+ </p>
+ <p>
+ <veui-searchbox
+ ui="large"
+ :name="name"
+ :placeholder="placeholder"
+ @search="log($event)"></veui-searchbox>
+ </p>
  </section>
  <section>
  <h2>禁用</h2>
@@ -37,7 +63,11 @@
  </p>
  </section>
  <section>
- <h2>小ui模式</h2>
+ <h2>ui模式：<span class="veui-font-level-2d">类型ui="primary"</span></h2>
+ <p>
+ <span class="veui-font-level-1b">小尺寸：</span>
+ <span class="veui-font-level-2d">ui="small"</span>
+ </p>
  <p>
  <veui-searchbox
  ui="primary small"
@@ -49,9 +79,25 @@
  @input="handleInput('2', $event)"
  @search="log($event)"></veui-searchbox>
  </p>
- </section>
- <section>
- <h2>大ui模式</h2>
+ <p>
+ <span class="veui-font-level-1b">默认尺寸：</span>
+ <span class="veui-font-level-2d">不传ui</span>
+ </p>
+ <p>
+ <veui-searchbox
+ ui="primary"
+ clearable
+ :name="name"
+ :placeholder="placeholder"
+ :suggestions="suggestions2"
+ replaceOnSelect
+ @input="handleInput('2', $event)"
+ @search="log($event)"></veui-searchbox>
+ </p>
+ <p>
+ <span class="veui-font-level-1b">大尺寸：</span>
+ <span class="veui-font-level-2d">ui="large"</span>
+ </p>
  <p>
  <veui-searchbox
  ui="primary large"
@@ -66,7 +112,7 @@
  <h2>全局搜索框</h2>
  <p>
  <veui-searchbox
- ui="primary"
+ ui="primary large"
  replaceOnSelect
  :name="name"
  :placeholder="placeholder"
@@ -80,7 +126,7 @@
  <h2>禁用全局搜索框</h2>
  <p>
  <veui-searchbox
- ui="alt primary"
+ ui="alt primary large"
  disabled
  :name="name"
  :placeholder="placeholder"

diff --git a/demo/components/Steps.vue b/demo/components/Steps.vue
@@ -6,19 +6,30 @@
  <p><label><veui-checkbox v-model="vertical">纵向样式</veui-checkbox></label></p>
  </section>
  <section>
- <h2>默认样式：</h2>
+ <p>
+ <span class="veui-font-level-1b">默认样式：</span>
+ <span class="veui-font-level-2d">ui="vertical"（纵向样式，不传ui则默认为横向样式）</span>
+ </p>
  <veui-steps :steps="steps" :current="current - 1" :ui="`${vertical ? 'vertical' : ''}`"></veui-steps>
  </section>
  <section>
- <h2>多行样式：</h2>
+ <p>
+ <span class="veui-font-level-1b">多行样式：</span>
+ <span class="veui-font-level-2d">ui="full"</span>
+ </p>
  <veui-steps :steps="steps" :ui="`full${vertical ? ' vertical' : ''}`" :current="current - 1"></veui-steps>
  </section>
  <section>
- <h2>小型样式：</h2>
+ <p>
+ <span class="veui-font-level-1b">小型样式：</span>
+ <span class="veui-font-level-2d">ui="small"</span>
+ </p>
  <veui-steps :steps="steps" :current="current - 1" :ui="`small ${vertical ? 'vertical' : ''}`"></veui-steps>
  </section>
  <section>
- <h2>自定义模板：</h2>
+ <p>
+ <span class="veui-font-level-1b">自定义模板：</span>
+ </p>
  <veui-steps :steps="steps" :ui="`full${vertical ? ' vertical' : ''}`" :current="current - 1">
  <template slot="label" slot-scope="step">{{ step.label }} <veui-icon class="star" name="star"></veui-icon></template>
  </veui-steps>