captain-ui/es/order-goods/src/components/card.js

有赞vue wap业务组件库

import "vant/es/button/style";
import _Button from "vant/es/button";
import "vant/es/popup/style";
import _Popup from "vant/es/popup";
import "vant/es/cell/style";
import _Cell from "vant/es/cell";
import "vant/es/card/style";
import _Card from "vant/es/card";

var _components;

import fullfillImage from '@youzan/utils/fullfillImage';
import Delivery from './delivery';
import MessageList from './message-list';
import { getTotalPrice } from '../utils';
export default {
  render: function render() {
    var _vm = this;

    var _h = _vm.$createElement;

    var _c = _vm._self._c || _h;

    return _c('div', {
      staticClass: "cap-order-goods-card"
    }, [_c('van-card', {
      attrs: {
        "thumb": _vm.thumb,
        "tag": _vm.data.is_present || _vm.data.present ? '赠品' : '',
        "title": _vm.data.title,
        "price": _vm.price,
        "desc": _vm.desc,
        "num": _vm.data.num,
        "currency": ""
      },
      on: {
        "click-thumb": _vm.onThumbClick
      }
    }, [_c('div', {
      staticClass: "cap-order-goods-card__tags",
      attrs: {
        "slot": "tags"
      },
      slot: "tags"
    }, [_vm.data.is_presale || _vm.data.presale ? _c('span', {
      staticClass: "cap-order-goods-card__tag-green"
    }, [_vm._v("\n        预售\n      ")]) : _vm._e(), _vm.data.is_period_buy ? _c('span', {
      staticClass: "cap-order-goods-card__tag-red"
    }, [_vm._v("\n        周期购\n      ")]) : _vm._e(), _vm.data.is_f_code ? _c('span', {
      staticClass: "cap-order-goods-card__tag-red"
    }, [_vm._v("\n        F码专享\n      ")]) : _vm._e(), _vm.data.activity_type === 23 ? _c('span', {
      staticClass: "cap-order-goods-card__tag-red"
    }, [_vm._v("\n        抽奖团\n      ")]) : _vm._e()]), _c('div', {
      staticClass: "cap-order-goods-card__action-container",
      attrs: {
        "slot": "footer"
      },
      slot: "footer"
    }, [_vm.hasMessage ? _c('van-button', {
      staticClass: "cap-order-goods-card__message-button",
      on: {
        "click": _vm.onClickMessageButton
      }
    }, [_vm._v("\n        查看留言\n      ")]) : _vm._e(), _vm.data.show_review ? _c('van-button', {
      staticClass: "cap-order-goods-card__review-button",
      on: {
        "click": _vm.onClickReviewButton
      }
    }, [_vm._v("\n        " + _vm._s(_vm.data.review_text) + "\n      ")]) : _vm._e(), _vm.data.show_refund ? _c('van-button', {
      staticClass: "cap-order-goods-card__refund-button cap-order-goods-card__button_red",
      on: {
        "click": _vm.onClickRefundButton
      }
    }, [_vm._v("\n        " + _vm._s(_vm.data.refund_text) + "\n      ")]) : _vm._e()], 1)]), _vm.data.show_delivery_time ? _c('van-cell', {
      staticClass: "cap-order-goods-card__delivery van-hairline--bottom",
      attrs: {
        "title": "发货时间",
        "value": _vm.data.delivery_time
      }
    }) : _vm._e(), _vm.data.show_delivery_times ? _c('van-cell', {
      staticClass: "cap-order-goods-card__delivery-times",
      attrs: {
        "title": "配送次数",
        "value": _vm.data.delivery_times
      }
    }) : _vm._e(), _vm.data.show_delivery_option ? _c('cap-order-goods-delivery-time', _vm._g({
      attrs: {
        "delivery-time": _vm.data.plan_express_time,
        "delivery-options": _vm.data.delivery_options
      }
    }, _vm.$listeners)) : _vm._e(), !_vm.disableMessageView ? _c('van-popup', {
      staticClass: "cap-order-goods-card__message",
      attrs: {
        "position": "right"
      },
      model: {
        value: _vm.showMessage,
        callback: function callback($$v) {
          _vm.showMessage = $$v;
        },
        expression: "showMessage"
      }
    }, [_c('cap-order-goods-message-list', {
      attrs: {
        "messages": _vm.data.message
      },
      on: {
        "back": function back($event) {
          _vm.showMessage = false;
        }
      }
    })], 1) : _vm._e()], 1);
  },
  name: 'cap-order-goods-card',
  components: (_components = {}, _components[_Card.name] = _Card, _components[_Cell.name] = _Cell, _components[_Popup.name] = _Popup, _components[_Button.name] = _Button, _components[Delivery.name] = Delivery, _components[MessageList.name] = MessageList, _components),
  props: {
    data: {
      type: Object,
      required: true
    },
    disableMessageView: Boolean
  },
  data: function data() {
    return {
      showMessage: false
    };
  },
  computed: {
    thumb: function thumb() {
      return this.processImage(this.data.img_url || 'https://img.yzcdn.cn/upload_files/no_pic.png');
    },
    price: function price() {
      return getTotalPrice(this.data.pay_price, this.data.points_price);
    },
    desc: function desc() {
      if (this.data.member_card_start_time && this.data.member_card_end_time) {
        return this.data.member_card_start_time + '-' + this.data.member_card_end_time;
      }

      var sku = this.data.sku;
      sku = Array.isArray(sku) ? sku : sku && typeof sku === 'string' ? JSON.parse(sku) : [];
      return sku.filter(function (item) {
        return item.v;
      }).map(function (item) {
        return item.v;
      }).join(', ');
    },
    hasMessage: function hasMessage() {
      return this.data.message && Object.keys(this.data.message).length;
    },
    goodsUrl: function goodsUrl() {
      return this.data.goods_url || 'javascript:;';
    }
  },
  methods: {
    onClickMessageButton: function onClickMessageButton() {
      this.showMessage = true;
      this.$emit('show-message-list', this.data.message);
    },
    onClickRefundButton: function onClickRefundButton() {
      this.$emit('action:refund', this.data.id);
    },
    onClickReviewButton: function onClickReviewButton() {
      this.$emit('action:review', this.data.id);
    },
    onThumbClick: function onThumbClick() {
      this.$emit('click-thumb', this.data.id);
    },
    processImage: function processImage(url) {
      return fullfillImage(url, '!180x180.jpg');
    }
  }
};