feat: 优化优惠券选择器，添加可用状态查询，更新消息卡组件样式

packages/app/src/pages/common/components/coupons-selector.vue

@@ -22,7 +22,27 @@ const { userInfo } = storeToRefs(userStore)
 const { alert } = useMessage()
 // const show = ref(false)
 const tab = ref(0)
-const request = ref()
+const query = ref<{ userId: number; available?: boolean }>({
+  userId: userInfo.value.userId,
+})
+const request = computed(() =>
+  props.type === 'points'
+    ? () =>
+        getPointsCoupons({
+          userId: userInfo.value.userId,
+          //   productIds: props.products.map((it) => it.productId).join(','),
+          businessId: props.businessId,
+          isUse: 0,
+          ...query.value,
+        })
+    : () =>
+        getProductCoupons({
+          userId: userInfo.value.userId,
+          productIds: props.products.map((it) => it.productId).join(','),
+          isUse: 0,
+          ...query.value,
+        }),
+)
 const { data: coupons, run: setCoupons } = useRequest(() => request.value(), { initialData: [] })
 const handleSelect = (coupon: Coupon) => {
   // if (modelValue.value.map(({ id }) => id).includes(coupon.id)) {
@@ -33,6 +53,11 @@ const handleSelect = (coupon: Coupon) => {
   modelValue.value = [coupon]
   emits('close')
 }
+const handleTabsChange = async ({ index, name }) => {
+  console.log(index)
+  query.value = { ...query.value, available: index === 0 }
+  await setCoupons()
+}
 watch(
   () => props.show,
   async (val) => {
@@ -45,40 +70,21 @@ watch(
     }
   },
 )
-onMounted(async () => {
-  if (props.type === 'product') {
-    request.value = () =>
-      getProductCoupons({
-        userId: userInfo.value.userId,
-        productIds: props.products.map((it) => it.productId).join(','),
-        isUse: 0,
-      })
-  }
-  if (props.type === 'points') {
-    request.value = () =>
-      getPointsCoupons({
-        userId: userInfo.value.userId,
-        //   productIds: props.products.map((it) => it.productId).join(','),
-        businessId: props.businessId,
-        isUse: 0,
-      })
-  }
-  //   await setCoupons()
-})
+onMounted(async () => {})
 </script>
 <template>
   <wd-action-sheet title="优惠券" :modelValue="show" @close="emits('close')">
     <view class="">
-      <wd-tabs v-model="tab">
+      <wd-tabs v-model="tab" @change="handleTabsChange">
         <wd-tab title="可用优惠券"></wd-tab>
-        <!-- <wd-tab title="不可用优惠券"></wd-tab> -->
+        <wd-tab title="不可用优惠券"></wd-tab>
       </wd-tabs>
       <div class="h-100 overflow-y-scroll">
         <div class="bg-[#f6f6f6] py-3.5 flex flex-col gap-4 min-h-full">
           <template v-for="(it, i) in coupons" :key="i">
             <CouponCard
               :options="{ couponType: 2, ...it }"
-              canSelect
+              :canSelect="tab === 0"
               :selected="modelValue?.map(({ id }) => id).includes(it.id)"
               @select="handleSelect"
               @click-instruction="(e) => emits('clickInstruction', e)"

packages/app/src/pages/messages/components/message-card.vue

@@ -8,6 +8,7 @@ import { MessageType, PointStatus } from '../../../core/libs/enums'
 import { getPointsCoupons } from '../../../core/libs/requests'
 import { getMessageType } from '../../../core/libs/message-types'
 import { useRouter } from '../../../core/utils/router'
+import ButtonEvo from '@/components/button-evo.vue'
 
 const props = withDefaults(defineProps<{ options?: Message }>(), {})
 const emits = defineEmits<{
@@ -18,7 +19,11 @@ const emits = defineEmits<{
 const router = useRouter()
 const { data: coupons, run: setCoupons } = useRequest(
   () =>
-    getPointsCoupons({ userId: props.options.designerId, businessId: props.options.businessId }),
+    getPointsCoupons({
+      userId: props.options.designerId,
+      businessId: props.options.businessId,
+      available: true,
+    }),
   { initialData: [] },
 )
 onMounted(async () => {
@@ -76,7 +81,7 @@ onMounted(async () => {
                 积分券
               </div>
               <div
-                class="flex items-center"
+                class="flex items-center h-full overflow-hidden"
                 @click="coupons.length && emits('selectCoupon', options, coupons)"
               >
                 <div
@@ -85,11 +90,11 @@ onMounted(async () => {
                 >
                   {{ `${coupons.length > 0 ? `${coupons.length}张可用` : '无可用'}` }}
                 </div>
-                <div class="h-5.5 overflow-hidden">
+                <div class="h-5.5 flex items-center overflow-hidden">
                   <wd-icon
                     name="chevron-right"
                     :custom-class="`${coupons.length > 0 ? 'text-[#ef4343]' : 'text-black/60'}`"
-                    size="20"
+                    size="16"
                   ></wd-icon>
                 </div>
               </div>
@@ -160,15 +165,19 @@ onMounted(async () => {
           options.pointsDetail?.pointsStauts === PointStatus.PendingConfirmation
         "
       >
-        <div class="flex gap-4">
+        <div class="flex gap-4 mt-4">
           <div class="flex-1">
-            <wd-button block :round="false" plain @click="emits('cancel', options)">驳回</wd-button>
+            <!-- <wd-button block :round="false" plain @click="emits('cancel', options)">驳回</wd-button> -->
+            <ButtonEvo block color="white" location="right" @click="emits('cancel', options)">
+              <span class="text-black/80">驳回</span>
+            </ButtonEvo>
           </div>
           <!-- <div class="flex-1">
             <wd-button block :round="false" @click="handleQ(it)">积分券</wd-button>
           </div> -->
           <div class="flex-1">
-            <wd-button block :round="false" @click="emits('submit', options)">确认</wd-button>
+            <!-- <wd-button block :round="false" @click="emits('submit', options)">确认</wd-button> -->
+            <ButtonEvo block @click="emits('submit', options)">确认</ButtonEvo>
           </div>
         </div>
       </div>