v1.0.0-beta 源码正式开源

2026-06-12 21:29:31 +08:00 · 2022-12-06 15:08:29 +08:00
commit 636ae7b169
461 changed files with 116817 additions and 0 deletions
@@ -0,0 +1,137 @@
+<template>
+	<view class="tm-coupon ">
+		<view :class="[`round-${round} `]">
+			<view :class="[disabled?'gray-100 opacity-4':'']" class="flex-start  " style="height: 150rpx;">
+				<view :class="[color_tmeme,black?'bk':'',text?'text':'',`round-r-${round} round-l-${round}`]" class=" flex-center flex-col px-24 flex-shrink fulled-height">
+					<view v-if="!h_objData.img">
+						<text v-show="h_objData.saleSplit" class="text-size-s">{{h_objData.saleSplit}}</text>
+						<text class=" text-weight-b" style="font-size:60rpx;">{{h_objData.sale}}</text>
+						<text v-show="h_objData.suffix" class="text-size-s">{{h_objData.suffix}}</text>
+					</view>
+					<view v-if="h_objData.img">
+						<image style="width: 100rpx;height: 100rpx;" class="rounded" :src="h_objData.img"></image>
+					</view>
+					<text v-show="h_objData.saleLable" class="text-size-xs text-align-center">{{h_objData.saleLable}}</text>
+				</view>
+				<view :class="[color_tmeme,black?'bk':'',text?'text':'',`round-l-${round} round-r-${round}`]" class=" flex-start fulled-height fulled overflow">
+					<view class="opacity-2" style="height: 100%;width: 0px;border-style: dashed; border-width: 0.5px;"></view>
+					<view class="px-24 flex-between fulled" >
+						<view class="flex-col">
+							<text v-show="h_objData.title" class="text-size-n text-weight-b d-block">{{h_objData.title}}</text>
+							<text v-show="h_objData.time" class="text-size-xxs d-block">{{h_objData.time}}</text>
+						</view>
+						<view @click="onclick" class=" flex-shrink" :class="[h_objData.title&&h_objData.time?'pl-24':'']">
+							<view :class="[color_tmeme,black?'bk':'',text?'':'text']" class="text-size-xs d-block round-24 px-24 py-6 ">{{h_objData.btnText}}</view>
+						</view>
+					</view>
+					
+				</view>
+			</view>
+			<view class="py-10 px-24 white" v-show="h_objData.label">
+				<text  class="text-size-xs d-block text-overflow-1 opacity-6">{{h_objData.label}}</text>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	/**
+	 * 优惠券
+	 * @property {String|Number} shadow = [] 默认：6，投影
+	 * @property {String|Number} round = [] 默认：4，圆角
+	 * @property {String | Boolean} text = [true|false] 默认：false，是否为文本模式，即减淡背景颜色。
+	 * @property {String | Boolean} black = [true|false] 默认：false，是否开启暗黑模式
+	 * @property {String | Boolean} disabled = [true|false] 默认：false，是否禁用（已使用）
+	 * @property {String | Boolean} hdata = [] 默认：｛｝，数据格式见文档
+	 * @property {String} color = [] 默认：primary，主题颜色名称
+	 * @property {Function} click 整个组件点击事件,返回项目数据
+	 * @example <tm-coupon :hdata="d_1"></tm-coupon>
+	 */
+	export default {
+		name:"tm-coupon",
+		props:{
+			// 跟随主题色的改变而改变。
+			fllowTheme:{
+				type:Boolean|String,
+				default:false
+			},
+			shadow: {
+				type: String|Number,
+				default: 3
+			},
+			round: {
+				type: String|Number,
+				default: 3
+			},
+			// 是否为文本模式，即减淡背景颜色。
+			text: {
+				type: String | Boolean,
+				default: false
+			},
+			// 是否开启暗黑模式
+			black: {
+				type: String | Boolean,
+				default: null
+			},
+			// 是否已经使用。
+			disabled: {
+				type: String | Boolean,
+				default: false
+			},
+			// 主题颜色名称
+			color: {
+				type: String,
+				default: 'primary'
+			},
+			hdata:{
+				type:Object,
+				default:()=>{
+					return {}
+				}
+			}
+		},
+		computed:{
+			black_tmeme: function() {
+				if (this.black !== null) return this.black;
+				return this.$tm.vx.state().tmVuetify.black;
+			},
+			color_tmeme:function(){
+				if(this.$tm.vx.state().tmVuetify.color!==null&&this.$tm.vx.state().tmVuetify.color && this.fllowTheme){
+					return this.$tm.vx.state().tmVuetify.color;
+				}
+				return this.color;
+			},
+			h_objData:function(){
+				let ps = {
+						img:'',//礼品图片，提供了图片，不显示数字和数字券说明。
+						sale:'0',
+						saleSplit:'￥',
+						saleLable:'',
+						title:'',
+						time:'',
+						btnText:'去使用',
+						label:'',
+						suffix:''
+					}
+				if(typeof this.hdata !== 'object') return ps;
+				ps = {...ps,...this.hdata};
+				return ps;
+			}
+		},
+		data() {
+			return {
+				
+			};
+		},
+		methods: {
+			onclick(e) {
+				if(this.disabled) return;
+				this.$emit('click',this.h_objData);
+			}
+		},
+	}
+</script>
+
+<style lang="scss">
+
+</style>