仿互站小程序

vant/action-sheet/index.js

@@ -0,0 +1,38 @@
+var e = require("../common/component"), t = require("../mixins/safe-area");
+
+(0, e.VantComponent)({
+    mixins: [ (0, t.safeArea)() ],
+    props: {
+        show: Boolean,
+        title: String,
+        cancelText: String,
+        zIndex: {
+            type: Number,
+            value: 100
+        },
+        actions: {
+            type: Array,
+            value: []
+        },
+        overlay: {
+            type: Boolean,
+            value: !0
+        },
+        closeOnClickOverlay: {
+            type: Boolean,
+            value: !0
+        }
+    },
+    methods: {
+        onSelect: function(e) {
+            var t = e.currentTarget.dataset.index, n = this.data.actions[t];
+            !n || n.disabled || n.loading || this.$emit("select", n);
+        },
+        onCancel: function() {
+            this.$emit("cancel");
+        },
+        onClose: function() {
+            this.$emit("close");
+        }
+    }
+});

vant/action-sheet/index.json

@@ -0,0 +1,13 @@
+{
+    "component": true,
+    "usingComponents": {
+        "van-icon": "../icon/index",
+        "van-popup": "../popup/index",
+        "van-loading": "../loading/index",
+        "forview": "/utils/forview/index",
+        "van-dialog": "/vant/dialog/index",
+        "van-button": "/vant/button/index",
+        "van-tab": "/vant/tab/index",
+        "van-tabs": "/vant/tabs/index"
+    }
+}

vant/action-sheet/index.wxml

@@ -0,0 +1,20 @@
+<van-popup bind:close="onClose" closeOnClickOverlay="{{closeOnClickOverlay}}" customClass="van-action-sheet" overlay="{{overlay}}" position="bottom" safeAreaInsetBottom="{{safeAreaInsetBottom}}" show="{{show}}" zIndex="{{zIndex}}">
+    <view class="van-hairline--bottom van-action-sheet__header" wx:if="{{title}}">
+    {{title}}
+    <van-icon bind:click="onClose" customClass="van-action-sheet__close" name="close"></van-icon>
+    </view>
+    <view wx:if="{{actions&&actions.length}}">
+        <button bind:tap="onSelect" class="{{utils.bem( 'action-sheet__item',{disabled:item.disabled||item.loading} )}} van-hairline--top {{item.className||''}}" data-index="{{index}}" hoverClass="van-action-sheet__item--hover" openType="{{item.openType}}" wx:for="{{actions}}" wx:key="index">
+            <block wx:if="{{!item.loading}}">
+        {{item.name}}
+        <text class="van-action-sheet__subname" wx:if="{{item.subname}}">{{item.subname}}</text>
+            </block>
+            <van-loading size="20px" wx:else></van-loading>
+        </button>
+    </view>
+    <slot></slot>
+    <view bind:tap="onCancel" class="van-action-sheet__cancel" hoverClass="van-action-sheet__cancel--hover" hoverStayTime="70" wx:if="{{cancelText}}">
+    {{cancelText}}
+  </view>
+</van-popup>
+<wxs module="utils" src="../wxs/utils.wxs" />

vant/action-sheet/index.wxss

@@ -0,0 +1,60 @@
+@import "../area/index.wxss";
+
+.van-action-sheet {
+    max-height: 90%!important;
+    color: #333;
+}
+
+.van-action-sheet__cancel,.van-action-sheet__item {
+    height: 50px;
+    font-size: 16px;
+    line-height: 50px;
+    text-align: center;
+    background-color: #fff;
+}
+
+.van-action-sheet__cancel--hover,.van-action-sheet__item--hover {
+    background-color: #f2f3f5;
+}
+
+.van-action-sheet__cancel {
+    height: 60px;
+}
+
+.van-action-sheet__cancel:before {
+    display: block;
+    height: 10px;
+    background-color: #f8f8f8;
+    content: " ";
+}
+
+.van-action-sheet__item--disabled {
+    color: #c9c9c9;
+}
+
+.van-action-sheet__item--disabled.van-action-sheet__item--hover {
+    background-color: #fff;
+}
+
+.van-action-sheet__subname {
+    margin-left: 5px;
+    font-size: 12px;
+    color: #7d7e80;
+}
+
+.van-action-sheet__header {
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 44px;
+    text-align: center;
+}
+
+.van-action-sheet__close {
+    position: absolute!important;
+    top: 0;
+    right: 0;
+    padding: 0 15px;
+    font-size: 18px!important;
+    line-height: inherit!important;
+    color: #999;
+}