1 line
9.3 KiB
Plaintext
1 line
9.3 KiB
Plaintext
{"version":3,"file":"su-coupon.js","sources":["../../../../../../src/sheep/ui/su-coupon/su-coupon.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9zaGVlcC91aS9zdS1jb3Vwb24vc3UtY291cG9uLnZ1ZQ"],"sourcesContent":["<template>\r\n <view class=\"ui-coupon-wrap\">\r\n <!-- xs: 一行三个,竖向 -->\r\n <view\r\n v-if=\"props.size === 'xs'\"\r\n class=\"xs-coupon-card ss-flex ss-flex-col ss-row-between\"\r\n :style=\"[cardStyle]\"\r\n @tap=\"\r\n sheep.$router.go('/modules/mall/coupon/detail', {\r\n id: couponId,\r\n })\r\n \"\r\n >\r\n <view class=\"ss-flex ss-flex-col ss-row-center ss-col-center\">\r\n <view class=\"face-value-box ss-flex ss-col-bottom ss-m-t-50 ss-m-b-28\">\r\n <view class=\"value-text ss-m-r-4\">{{ type === 'reduce' ? value : Number(value) }}</view>\r\n <view class=\"value-unit\">{{ type === 'reduce' ? '元' : '折' }}</view>\r\n </view>\r\n <view class=\"title-text\">{{ props.title }}</view>\r\n </view>\r\n <view class=\"card-bottom ss-m-b-30 ss-flex ss-row-center\">\r\n <slot name=\"btn\">\r\n <button class=\"ss-reset-button card-btn\">{{ state.stateMap[props.state] }}</button>\r\n </slot>\r\n </view>\r\n </view>\r\n\r\n <!-- md: 一行两个,横向 -->\r\n <view\r\n v-if=\"props.size === 'md'\"\r\n class=\"md-coupon-card ss-flex ss-row-between\"\r\n :style=\"[cardStyle]\"\r\n @tap=\"\r\n sheep.$router.go('/modules/mall/coupon/detail', {\r\n id: couponId,\r\n })\r\n \"\r\n >\r\n <view class=\"card-left ss-flex ss-flex-col ss-row-between ss-col-top ss-m-l-40\">\r\n <view class=\"face-value-box ss-flex ss-col-bottom ss-m-t-28\">\r\n <view class=\"value-text ss-m-r-4\">{{ type === 'reduce' ? value : Number(value) }}</view>\r\n <view class=\"value-unit\">{{ type === 'reduce' ? '元' : '折' }}</view>\r\n </view>\r\n <view class=\"ss-m-b-28\">\r\n <view class=\"title-text ss-m-b-10\">{{ props.title }}</view>\r\n <view class=\"surplus-text\" v-if=\"props.surplus\">仅剩:{{ props.surplus }}张</view>\r\n </view>\r\n </view>\r\n <view class=\"card-right ss-flex ss-row-center\">\r\n <slot name=\"btn\">\r\n <button class=\"ss-reset-button card-btn ss-flex ss-row-center ss-col-center\">\r\n <view class=\"btn-text\">{{ state.stateMap[props.state] }}</view>\r\n </button>\r\n </slot>\r\n </view>\r\n </view>\r\n\r\n <!-- lg: 一行一个,横向 -->\r\n <view\r\n v-if=\"props.size === 'lg'\"\r\n class=\"lg-coupon-card ss-flex ss-row-between\"\r\n :style=\"[cardStyle]\"\r\n @tap=\"\r\n sheep.$router.go('/modules/mall/coupon/detail', {\r\n id: couponId,\r\n })\r\n \"\r\n >\r\n <view class=\"card-left ss-flex ss-flex-col ss-row-between ss-col-top ss-m-l-40\">\r\n <view class=\"face-value-box ss-flex ss-col-bottom ss-m-t-28\">\r\n <view class=\"value-text ss-m-r-4\">{{ type === 'reduce' ? value : Number(value) }}</view>\r\n <view class=\"value-unit\">{{ type === 'reduce' ? '元' : '折' }}</view>\r\n </view>\r\n <view class=\"ss-m-b-20\">\r\n <view class=\"title-text ss-m-b-10\">{{ props.title }}</view>\r\n <view class=\"sellby-text\">有效期:{{ props.sellBy }}</view>\r\n </view>\r\n </view>\r\n <view class=\"card-right ss-flex ss-flex-col ss-col-center ss-row-center\">\r\n <slot name=\"btn\">\r\n <button class=\"ss-reset-button card-btn ss-flex ss-row-center ss-col-center\">\r\n {{ state.stateMap[props.state] }}\r\n </button>\r\n </slot>\r\n <view class=\"surplus-text ss-m-t-24\" v-if=\"props.surplus\">仅剩:{{ props.surplus }}张</view>\r\n </view>\r\n </view>\r\n </view>\r\n</template>\r\n\r\n<script setup>\r\n/**\r\n * 优惠券 卡片\r\n *\r\n * @property {String} size = ['xs','md','lg']\t\t\t\t\t- 类型 xs:一行三个,md:一行两个,lg:一行一个\r\n * @property {String} textColor \t\t\t\t\t\t\t\t- 文字颜色\r\n * @property {String} background \t\t\t\t\t\t\t\t- 背景\r\n * @property {String} btnBg\t\t\t\t\t\t\t\t\t\t- 按钮背景\r\n * @property {String} btnTextColor\t\t\t\t\t\t\t\t- 按钮文字颜色\r\n * @property {Number} state = [0,1]\t\t\t\t\t\t\t\t- 状态,0:未领取,1:已领取\r\n * @property {String} title\t\t\t\t\t\t\t\t\t\t- 标题\r\n * @property {String | Number} value\t\t\t\t\t\t\t- 面值\r\n * @property {String} sellBy\t\t\t\t\t\t\t\t\t- 有效期\r\n * @property {String | Number} surplus\t\t\t\t\t\t\t- 剩余\r\n *\r\n */\r\nimport { computed, reactive } from 'vue'\r\nimport sheep from '@/sheep'\r\n\r\n// 数据\r\nconst state = reactive({\r\n stateMap: {\r\n 0: '立即领取',\r\n 1: '去使用',\r\n },\r\n})\r\n\r\n// 接受参数\r\nconst props = defineProps({\r\n size: {\r\n type: String,\r\n default: 'lg',\r\n },\r\n textColor: {\r\n type: String,\r\n default: '#FF6000',\r\n },\r\n background: {\r\n type: String,\r\n default: '#FFC19C',\r\n },\r\n btnBg: {\r\n type: String,\r\n default: '#fff',\r\n },\r\n btnTextColor: {\r\n type: String,\r\n default: '#FF6000',\r\n },\r\n state: {\r\n type: Number,\r\n default: 0,\r\n },\r\n couponId: {\r\n type: Number,\r\n default: 0,\r\n },\r\n title: {\r\n type: String,\r\n default: '这是优惠券',\r\n },\r\n value: {\r\n type: [Number, String],\r\n default: 50,\r\n },\r\n sellBy: {\r\n type: String,\r\n default: '2019.11.25至2019.12.25',\r\n },\r\n surplus: {\r\n type: [Number, String],\r\n default: 0,\r\n },\r\n type: {\r\n type: String,\r\n default: '',\r\n },\r\n})\r\n\r\nconst cardStyle = computed(() => {\r\n return {\r\n background: props.background,\r\n }\r\n})\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n// xs\r\n.xs-coupon-card {\r\n width: 227rpx;\r\n overflow: hidden;\r\n // height: 145px;\r\n border-radius: 10rpx;\r\n\r\n .value-text {\r\n font-size: 50rpx;\r\n font-weight: bold;\r\n line-height: 50rpx;\r\n color: v-bind('textColor');\r\n vertical-align: text-bottom;\r\n }\r\n\r\n .value-unit {\r\n font-size: 24rpx;\r\n line-height: 38rpx;\r\n color: v-bind('textColor');\r\n }\r\n\r\n .title-text {\r\n width: 150rpx;\r\n font-size: 24rpx;\r\n line-height: 30rpx;\r\n color: v-bind('textColor');\r\n text-align: center;\r\n }\r\n\r\n .card-btn {\r\n width: 140rpx;\r\n height: 50rpx;\r\n font-size: 24rpx;\r\n line-height: 50rpx;\r\n color: v-bind('btnTextColor');\r\n background-color: v-bind('btnBg');\r\n border-color: v-bind('btnTextColor');\r\n border-style: solid;\r\n border-width: 1px;\r\n border-radius: 25rpx;\r\n }\r\n}\r\n\r\n// md\r\n\r\n.md-coupon-card {\r\n width: 330rpx;\r\n height: 168rpx;\r\n overflow: hidden;\r\n border-radius: 10rpx;\r\n\r\n .card-right,\r\n .card-left {\r\n height: 100%;\r\n }\r\n\r\n .value-text {\r\n font-size: 36rpx;\r\n font-weight: bold;\r\n line-height: 36rpx;\r\n color: v-bind('textColor');\r\n vertical-align: text-bottom;\r\n }\r\n\r\n .value-unit {\r\n font-size: 22rpx;\r\n line-height: 28rpx;\r\n color: v-bind('textColor');\r\n }\r\n\r\n .title-text,\r\n .surplus-text {\r\n font-size: 22rpx;\r\n line-height: 22rpx;\r\n color: v-bind('textColor');\r\n }\r\n\r\n .card-btn {\r\n width: 60rpx;\r\n height: 100%;\r\n\r\n .btn-text {\r\n font-size: 24rpx;\r\n color: v-bind('btnTextColor');\r\n text-align: center;\r\n writing-mode: vertical-lr;\r\n writing-mode: tb-lr;\r\n }\r\n }\r\n}\r\n\r\n// lg\r\n.lg-coupon-card {\r\n width: 708rpx;\r\n height: 168rpx;\r\n overflow: hidden;\r\n border-radius: 10rpx;\r\n\r\n .card-right,\r\n .card-left {\r\n height: 100%;\r\n }\r\n\r\n .value-text {\r\n font-size: 50rpx;\r\n font-weight: bold;\r\n line-height: 50rpx;\r\n color: v-bind('textColor');\r\n vertical-align: text-bottom;\r\n }\r\n\r\n .value-unit {\r\n font-size: 22rpx;\r\n line-height: 32rpx;\r\n color: v-bind('textColor');\r\n }\r\n\r\n .title-text,\r\n .sellby-text,\r\n .surplus-text {\r\n font-size: 22rpx;\r\n line-height: 22rpx;\r\n color: v-bind('textColor');\r\n }\r\n\r\n .card-right {\r\n width: 200rpx;\r\n .card-btn {\r\n width: 140rpx;\r\n height: 50rpx;\r\n font-size: 24rpx;\r\n line-height: 50rpx;\r\n color: v-bind('btnTextColor');\r\n background-color: v-bind('btnBg');\r\n border-color: v-bind('btnTextColor');\r\n border-style: solid;\r\n border-width: 1px;\r\n border-radius: 25rpx;\r\n }\r\n }\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/sheep/ui/su-coupon/su-coupon.vue'\nwx.createComponent(Component)"],"names":["reactive","computed"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8GA,UAAM,QAAQA,cAAAA,SAAS;AAAA,MACrB,UAAU;AAAA,QACR,GAAG;AAAA,QACH,GAAG;AAAA,MACJ;AAAA,IACH,CAAC;AAGD,UAAM,QAAQ;AAmDd,UAAM,YAAYC,cAAQ,SAAC,MAAM;AAC/B,aAAO;AAAA,QACL,YAAY,MAAM;AAAA,MACnB;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5KD,GAAG,gBAAgB,SAAS;"} |