types(Coupon): use tsx (#8088)

src/coupon-list/demo/index.vue

@@ -26,7 +26,7 @@
 <script lang="ts">
 import { computed, reactive, toRefs } from 'vue';
 import { useTranslate } from '@demo/use-translate';
-import { Coupon } from '../../coupon/shared';
+import { CouponInfo } from '../../coupon';
 import Toast from '../../toast';
 
 const i18n = {
@@ -57,7 +57,7 @@ export default {
     const state = reactive({
       showList: false,
       chosenCoupon: -1,
-      exchangedCoupons: [] as Coupon[],
+      exchangedCoupons: [] as CouponInfo[],
     });
 
     const coupon = computed(() => ({

src/coupon/index.tsx

@@ -1,22 +1,38 @@
-import { computed } from 'vue';
+import { computed, PropType } from 'vue';
 import { padZero, createNamespace } from '../utils';
 import { RED } from '../utils/constant';
 import Checkbox from '../checkbox';
 
+export type CouponInfo = {
+  id: string;
+  name: string;
+  endAt: number;
+  value: number;
+  startAt: number;
+  reason?: string;
+  discount?: number;
+  unitDesc?: string;
+  condition?: string;
+  valueDesc?: string;
+  description: string;
+  denominations?: number;
+  originCondition?: number;
+};
+
 const [createComponent, bem, t] = createNamespace('coupon');
 
-function getDate(timeStamp) {
+function getDate(timeStamp: number) {
   const date = new Date(timeStamp * 1000);
   return `${date.getFullYear()}.${padZero(date.getMonth() + 1)}.${padZero(
     date.getDate()
   )}`;
 }
 
-function formatDiscount(discount) {
+function formatDiscount(discount: number) {
   return (discount / 10).toFixed(discount % 10 === 0 ? 0 : 1);
 }
 
-function formatAmount(amount) {
+function formatAmount(amount: number) {
   return (amount / 100).toFixed(
     amount % 100 === 0 ? 0 : amount % 10 === 0 ? 1 : 2
   );
@@ -24,9 +40,12 @@ function formatAmount(amount) {
 
 export default createComponent({
   props: {
-    coupon: Object,
     chosen: Boolean,
     disabled: Boolean,
+    coupon: {
+      type: Object as PropType<CouponInfo>,
+      required: true,
+    },
     currency: {
       type: String,
       default: '¥',
@@ -59,7 +78,7 @@ export default createComponent({
     });
 
     const conditionMessage = computed(() => {
-      const condition = formatAmount(props.coupon.originCondition);
+      const condition = formatAmount(props.coupon.originCondition || 0);
       return condition === '0' ? t('unlimited') : t('condition', condition);
     });
 

src/coupon/shared.ts

@@ -1,14 +0,0 @@
-export type Coupon = {
-  id: string;
-  name: string;
-  endAt: number;
-  value: number;
-  startAt: number;
-  reason?: string;
-  discount?: number;
-  unitDesc?: string;
-  condition?: string;
-  valueDesc?: string;
-  description: string;
-  denominations?: number;
-};