1 line
7.5 KiB
Plaintext
1 line
7.5 KiB
Plaintext
{"version":3,"file":"s-live-card.js","sources":["../../../../../../src/sheep/components/s-live-card/s-live-card.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9zaGVlcC9jb21wb25lbnRzL3MtbGl2ZS1jYXJkL3MtbGl2ZS1jYXJkLnZ1ZQ"],"sourcesContent":["<template>\r\n <view>\r\n <!-- md卡片:竖向,一行放两个,图上内容下 -->\r\n <view v-if=\"size === 'md'\" class=\"md-goods-card ss-flex-col\" :style=\"[elStyles]\" @tap=\"onClick\">\r\n <view class=\"icon-box ss-flex\">\r\n <image class=\"icon\" :src=\"state.liveStatus[data.status].img\"></image>\r\n <view class=\"title ss-m-l-16\">{{ state.liveStatus[data.status].title }}</view>\r\n </view>\r\n <img class=\"md-img-box\" :src=\"sheep.$url.cdn(data.feeds_img)\" referrerpolicy=\"no-referrer\" />\r\n <view class=\"md-goods-content\">\r\n <view class=\"md-goods-title ss-line-1\" :style=\"[{ color: titleColor }]\">\r\n {{ data.name }}\r\n </view>\r\n <view class=\"md-goods-subtitle ss-m-t-14 ss-line-1\" :style=\"[{ color: subTitleColor }]\">\r\n 主播:{{ data.anchor_name }}\r\n </view>\r\n </view>\r\n </view>\r\n <!-- sl卡片:竖向型,一行放一个,图片上内容下边 -->\r\n <view v-if=\"size === 'sl'\" class=\"sl-goods-card ss-flex-col\" :style=\"[elStyles]\" @tap=\"onClick\">\r\n <view class=\"icon-box ss-flex\">\r\n <image class=\"icon\" :src=\"state.liveStatus[data.status].img\"></image>\r\n <view class=\"title ss-m-l-16\">{{ state.liveStatus[data.status].title }}</view>\r\n </view>\r\n <img class=\"sl-img-box\" :src=\"sheep.$url.cdn(data.feeds_img)\" referrerpolicy=\"no-referrer\" />\r\n <view class=\"sl-goods-content\">\r\n <view class=\"sl-goods-title ss-line-1\" :style=\"[{ color: titleColor }]\">\r\n {{ data.name }}\r\n </view>\r\n <view class=\"sl-goods-subtitle ss-m-t-14 ss-line-1\" :style=\"[{ color: subTitleColor }]\">\r\n 主播:{{ data.anchor_name }}\r\n </view>\r\n </view>\r\n </view>\r\n </view>\r\n</template>\r\n<script setup>\r\nimport { computed, reactive } from 'vue'\r\nimport sheep from '@/sheep'\r\n/**\r\n * 直播卡片\r\n *\r\n * @property {String} img \t\t\t\t\t\t\t\t\t\t\t- 图片\r\n * @property {String} title \t\t\t\t\t\t\t\t\t\t- 标题\r\n * @property {Number} titleWidth = 0\t\t\t\t\t\t\t\t- 标题宽度,默认0,单位rpx\r\n * @property {String} skuText \t\t\t\t\t\t\t\t\t\t- 规格\r\n * @property {String | Number} score \t\t\t\t\t\t\t\t- 积分\r\n * @property {String | Number} price \t\t\t\t\t\t\t\t- 价格\r\n * @property {String | Number} originalPrice \t\t\t\t\t\t- 单购价\r\n * @property {String} priceColor \t\t\t\t\t\t\t\t\t- 价格颜色\r\n * @property {Number | String} num\t\t\t\t\t\t\t\t\t- 数量\r\n *\r\n */\r\nconst props = defineProps({\r\n goodsFields: {\r\n type: [Array, Object],\r\n default() {\r\n return {}\r\n },\r\n },\r\n tagStyle: {\r\n type: Object,\r\n default: {},\r\n },\r\n data: {\r\n type: Object,\r\n default: {},\r\n },\r\n size: {\r\n type: String,\r\n default: 'sl',\r\n },\r\n background: {\r\n type: String,\r\n default: '',\r\n },\r\n topRadius: {\r\n type: Number,\r\n default: 0,\r\n },\r\n bottomRadius: {\r\n type: Number,\r\n default: 0,\r\n },\r\n titleColor: {\r\n type: String,\r\n default: '#333',\r\n },\r\n subTitleColor: {\r\n type: String,\r\n default: '#999999',\r\n },\r\n})\r\n// 组件样式\r\nconst elStyles = computed(() => {\r\n return {\r\n background: props.background,\r\n 'border-top-left-radius': props.topRadius + 'px',\r\n 'border-top-right-radius': props.topRadius + 'px',\r\n 'border-bottom-left-radius': props.bottomRadius + 'px',\r\n 'border-bottom-right-radius': props.bottomRadius + 'px',\r\n }\r\n})\r\nconst state = reactive({\r\n liveStatus: {\r\n 101: {\r\n img: sheep.$url.static('/static/img/shop/app/mplive/living.png'),\r\n title: '直播中',\r\n },\r\n 102: {\r\n img: sheep.$url.static('/static/img/shop/app/mplive/start.png'),\r\n title: '未开始',\r\n },\r\n 103: {\r\n img: sheep.$url.static('/static/img/shop/app/mplive/ended.png'),\r\n title: '已结束',\r\n },\r\n },\r\n})\r\nconst emits = defineEmits(['click', 'getHeight'])\r\nconst onClick = () => {\r\n emits('click')\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n// md\r\n.md-goods-card {\r\n position: relative;\r\n z-index: 1;\r\n width: 100%;\r\n height: 424rpx;\r\n overflow: hidden;\r\n background-color: $white;\r\n .icon-box {\r\n position: absolute;\r\n top: 10rpx;\r\n left: 20rpx;\r\n z-index: 1;\r\n width: 136rpx;\r\n height: 40rpx;\r\n background: rgba(#000000, 0.5);\r\n border-radius: 20rpx;\r\n .icon {\r\n width: 40rpx;\r\n height: 40rpx;\r\n border-radius: 20rpx 0px 20rpx 20rpx;\r\n }\r\n .title {\r\n font-size: 24rpx;\r\n font-weight: 500;\r\n color: #ffffff;\r\n }\r\n }\r\n .md-goods-content {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 20rpx;\r\n background: linear-gradient(360deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.02) 100%);\r\n }\r\n\r\n .md-img-box {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n .md-goods-title {\r\n width: 100%;\r\n font-size: 26rpx;\r\n color: #333;\r\n }\r\n .md-goods-subtitle {\r\n font-size: 24rpx;\r\n font-weight: 400;\r\n color: #999999;\r\n }\r\n}\r\n.sl-goods-card {\r\n position: relative;\r\n z-index: 1;\r\n width: 100%;\r\n height: 400rpx;\r\n overflow: hidden;\r\n background-color: $white;\r\n .icon-box {\r\n position: absolute;\r\n top: 10rpx;\r\n left: 20rpx;\r\n z-index: 1;\r\n width: 136rpx;\r\n height: 40rpx;\r\n background: rgba(#000000, 0.5);\r\n border-radius: 20rpx;\r\n .icon {\r\n width: 40rpx;\r\n height: 40rpx;\r\n border-radius: 20rpx 0px 20rpx 20rpx;\r\n }\r\n .title {\r\n font-size: 24rpx;\r\n font-weight: 500;\r\n color: #ffffff;\r\n }\r\n }\r\n .sl-goods-content {\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n padding: 20rpx;\r\n background: linear-gradient(360deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.02) 100%);\r\n }\r\n\r\n .sl-img-box {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n .sl-goods-title {\r\n width: 100%;\r\n font-size: 26rpx;\r\n color: #333;\r\n }\r\n .sl-goods-subtitle {\r\n font-size: 24rpx;\r\n font-weight: 400;\r\n color: #999999;\r\n }\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/sheep/components/s-live-card/s-live-card.vue'\nwx.createComponent(Component)"],"names":["computed","reactive","sheep"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA,UAAM,QAAQ;AAyCd,UAAM,WAAWA,cAAQ,SAAC,MAAM;AAC9B,aAAO;AAAA,QACL,YAAY,MAAM;AAAA,QAClB,0BAA0B,MAAM,YAAY;AAAA,QAC5C,2BAA2B,MAAM,YAAY;AAAA,QAC7C,6BAA6B,MAAM,eAAe;AAAA,QAClD,8BAA8B,MAAM,eAAe;AAAA,MACpD;AAAA,IACH,CAAC;AACD,UAAM,QAAQC,cAAAA,SAAS;AAAA,MACrB,YAAY;AAAA,QACV,KAAK;AAAA,UACH,KAAKC,YAAK,MAAC,KAAK,OAAO,wCAAwC;AAAA,UAC/D,OAAO;AAAA,QACR;AAAA,QACD,KAAK;AAAA,UACH,KAAKA,YAAK,MAAC,KAAK,OAAO,uCAAuC;AAAA,UAC9D,OAAO;AAAA,QACR;AAAA,QACD,KAAK;AAAA,UACH,KAAKA,YAAK,MAAC,KAAK,OAAO,uCAAuC;AAAA,UAC9D,OAAO;AAAA,QACR;AAAA,MACF;AAAA,IACH,CAAC;AACD,UAAM,QAAQ;AACd,UAAM,UAAU,MAAM;AACpB,YAAM,OAAO;AAAA,IACf;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzHA,GAAG,gBAAgB,SAAS;"} |