You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
172 lines
4.2 KiB
172 lines
4.2 KiB
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
|
|
exports.__esModule = true;
|
|
exports.default = void 0;
|
|
|
|
var _babelHelperVueJsxMergeProps = _interopRequireDefault(require("@vue/babel-helper-vue-jsx-merge-props"));
|
|
|
|
var _utils = require("../utils");
|
|
|
|
var _functional = require("../utils/functional");
|
|
|
|
var _tag = _interopRequireDefault(require("../tag"));
|
|
|
|
var _image = _interopRequireDefault(require("../image"));
|
|
|
|
// Utils
|
|
// Components
|
|
var _createNamespace = (0, _utils.createNamespace)('card'),
|
|
createComponent = _createNamespace[0],
|
|
bem = _createNamespace[1];
|
|
|
|
function Card(h, props, slots, ctx) {
|
|
var _slots$priceTop;
|
|
|
|
var thumb = props.thumb;
|
|
var showNum = slots.num || (0, _utils.isDef)(props.num);
|
|
var showPrice = slots.price || (0, _utils.isDef)(props.price);
|
|
var showOriginPrice = slots['origin-price'] || (0, _utils.isDef)(props.originPrice);
|
|
var showBottom = showNum || showPrice || showOriginPrice || slots.bottom;
|
|
|
|
function onThumbClick(event) {
|
|
(0, _functional.emit)(ctx, 'click-thumb', event);
|
|
}
|
|
|
|
function ThumbTag() {
|
|
if (slots.tag || props.tag) {
|
|
return h("div", {
|
|
"class": bem('tag')
|
|
}, [slots.tag ? slots.tag() : h(_tag.default, {
|
|
"attrs": {
|
|
"mark": true,
|
|
"type": "danger"
|
|
}
|
|
}, [props.tag])]);
|
|
}
|
|
}
|
|
|
|
function Thumb() {
|
|
if (slots.thumb || thumb) {
|
|
return h("a", {
|
|
"attrs": {
|
|
"href": props.thumbLink
|
|
},
|
|
"class": bem('thumb'),
|
|
"on": {
|
|
"click": onThumbClick
|
|
}
|
|
}, [slots.thumb ? slots.thumb() : h(_image.default, {
|
|
"attrs": {
|
|
"src": thumb,
|
|
"width": "100%",
|
|
"height": "100%",
|
|
"fit": "cover",
|
|
"lazy-load": props.lazyLoad
|
|
}
|
|
}), ThumbTag()]);
|
|
}
|
|
}
|
|
|
|
function Title() {
|
|
if (slots.title) {
|
|
return slots.title();
|
|
}
|
|
|
|
if (props.title) {
|
|
return h("div", {
|
|
"class": [bem('title'), 'van-multi-ellipsis--l2']
|
|
}, [props.title]);
|
|
}
|
|
}
|
|
|
|
function Desc() {
|
|
if (slots.desc) {
|
|
return slots.desc();
|
|
}
|
|
|
|
if (props.desc) {
|
|
return h("div", {
|
|
"class": [bem('desc'), 'van-ellipsis']
|
|
}, [props.desc]);
|
|
}
|
|
}
|
|
|
|
function PriceContent() {
|
|
var priceArr = props.price.toString().split('.');
|
|
return h("div", [h("span", {
|
|
"class": bem('price-currency')
|
|
}, [props.currency]), h("span", {
|
|
"class": bem('price-integer')
|
|
}, [priceArr[0]]), ".", h("span", {
|
|
"class": bem('price-decimal')
|
|
}, [priceArr[1]])]);
|
|
}
|
|
|
|
function Price() {
|
|
if (showPrice) {
|
|
return h("div", {
|
|
"class": bem('price')
|
|
}, [slots.price ? slots.price() : PriceContent()]);
|
|
}
|
|
}
|
|
|
|
function OriginPrice() {
|
|
if (showOriginPrice) {
|
|
var slot = slots['origin-price'];
|
|
return h("div", {
|
|
"class": bem('origin-price')
|
|
}, [slot ? slot() : props.currency + " " + props.originPrice]);
|
|
}
|
|
}
|
|
|
|
function Num() {
|
|
if (showNum) {
|
|
return h("div", {
|
|
"class": bem('num')
|
|
}, [slots.num ? slots.num() : "x" + props.num]);
|
|
}
|
|
}
|
|
|
|
function Footer() {
|
|
if (slots.footer) {
|
|
return h("div", {
|
|
"class": bem('footer')
|
|
}, [slots.footer()]);
|
|
}
|
|
}
|
|
|
|
return h("div", (0, _babelHelperVueJsxMergeProps.default)([{
|
|
"class": bem()
|
|
}, (0, _functional.inherit)(ctx, true)]), [h("div", {
|
|
"class": bem('header')
|
|
}, [Thumb(), h("div", {
|
|
"class": bem('content', {
|
|
centered: props.centered
|
|
})
|
|
}, [h("div", [Title(), Desc(), slots.tags == null ? void 0 : slots.tags()]), showBottom && h("div", {
|
|
"class": "van-card__bottom"
|
|
}, [(_slots$priceTop = slots['price-top']) == null ? void 0 : _slots$priceTop.call(slots), Price(), OriginPrice(), Num(), slots.bottom == null ? void 0 : slots.bottom()])])]), Footer()]);
|
|
}
|
|
|
|
Card.props = {
|
|
tag: String,
|
|
desc: String,
|
|
thumb: String,
|
|
title: String,
|
|
centered: Boolean,
|
|
lazyLoad: Boolean,
|
|
thumbLink: String,
|
|
num: [Number, String],
|
|
price: [Number, String],
|
|
originPrice: [Number, String],
|
|
currency: {
|
|
type: String,
|
|
default: '¥'
|
|
}
|
|
};
|
|
|
|
var _default = createComponent(Card);
|
|
|
|
exports.default = _default; |