[improvement]cell:优化默认slot展示效果，添加title区域自定义class

example/pages/cell/index.js

@@ -3,7 +3,8 @@ var Zan = require('../../dist/index');
 Page(Object.assign({}, Zan.Switch, {
   data: {
     checked: false,
-    show: true
+    show: true,
+    date: ''
   },
 
   onLoad() {
@@ -18,6 +19,12 @@ Page(Object.assign({}, Zan.Switch, {
     });
   },
 
+  bindDateChange(e) {
+    this.setData({
+      date: e.detail.value
+    });
+  },
+
   handleTap() {
     console.log('cell tapped');
   }

example/pages/cell/index.wxml

@@ -18,6 +18,16 @@
     </zan-cell>
   </zan-panel>
 
+  <zan-panel class="cell-panel-demo">
+    <zan-cell title="单行列表">
+      <picker mode="date" value="{{date}}" start="2018-07-01" end="2018-09-01" bindchange="bindDateChange">
+        <view class="picker">
+          选择日期: {{date}}
+        </view>
+      </picker>
+    </zan-cell>
+  </zan-panel>
+
   <zan-panel class="cell-panel-demo" title="带箭头的 cell">
     <zan-cell title="只显示箭头" is-link></zan-cell>
   </zan-panel>

packages/cell/README.md

@@ -66,3 +66,4 @@
 | 类名       | 说明      |
 |-----------|-----------|
 | cell-class | 根节点自定义样式类，通过这个可以改变根节点上的样式 |
+| title-class | title区域自定义样式 |

packages/cell/index.js

@@ -4,7 +4,7 @@ const warn = (msg, getValue) => {
 };
 
 Component({
-  externalClasses: ['cell-class'],
+  externalClasses: ['cell-class', 'title-class'],
   options: {
     multipleSlots: true
   },

packages/cell/index.pcss

@@ -24,6 +24,15 @@
   display: none
 }
 
+.zan-cell__title {
+  min-width: 65px;
+  padding-right: 10px;
+}
+
+.zan-cell__title:empty {
+  display: none;
+}
+
 .zan-cell__bd {
   flex: 1;
 }

packages/cell/index.wxml

@@ -7,9 +7,12 @@
     <slot name="icon"></slot>
   </view>
 
-  <view class="zan-cell__bd">
+  <view class="title-class zan-cell__title">
     <view wx:if="{{ title }}" class="zan-cell__text">{{ title }}</view>
     <view wx:if="{{ label }}" class="zan-cell__desc">{{ label }}</view>
+  </view>
+
+  <view class="zan-cell__bd">
     <slot></slot>
   </view>