From e75076815db5ab6870353d0760b962b671e7c56f Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期二, 23 十二月 2025 17:50:28 +0800
Subject: [PATCH] fix: 甲方小程序

---
 apps/housekeepingMiniApp/src/components/Card/ReserveServiceCard.vue |  204 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 204 insertions(+), 0 deletions(-)

diff --git a/apps/housekeepingMiniApp/src/components/Card/ReserveServiceCard.vue b/apps/housekeepingMiniApp/src/components/Card/ReserveServiceCard.vue
new file mode 100644
index 0000000..01f128c
--- /dev/null
+++ b/apps/housekeepingMiniApp/src/components/Card/ReserveServiceCard.vue
@@ -0,0 +1,204 @@
+<template>
+  <div class="reserve-service-card-wrapper" :class="{ 'un-read': unRead }">
+    <div class="reserve-service-card-title-wrapper">
+      <div class="reserve-service-card-title">{{ name }}</div>
+      <slot name="title-right">
+        <TaskPrice
+          v-if="releaseStatus !== EnumTaskReleaseStatus.Stopped"
+          :value="toThousand(serviceFee ?? 0)"
+          :unit="BillingMethodEnumUnit[billingMethod]"
+          :billingMethod="billingMethod"
+        />
+      </slot>
+    </div>
+    <div class="reserve-service-card-item-list">
+      <div class="reserve-service-card-item">
+        鏈嶅姟鏃堕棿锛歿{ dayjs(beginTime).format('YYYY骞碝M鏈圖鏃�') }} 13:00-15:00
+      </div>
+      <div class="reserve-service-card-item">鏈嶅姟鍦板潃锛歿{ addressName }}</div>
+    </div>
+
+    <div class="reserve-service-card-footer">
+      <div class="reserve-service-card-left">
+        <div class="reserve-service-card-footer-address">鏈嶅姟鏈烘瀯锛氭垜鏄満鏋勫悕绉�</div>
+      </div>
+      <div class="reserve-service-card-status">寰呯‘璁�</div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  EnumBillingMethod,
+  EnumSettlementCycle,
+  EnumTaskCheckReceiveStatus,
+  EnumTaskRecommendStatus,
+  EnumTaskReleaseStatus,
+  EnumTaskSettlementStatus,
+  EnumTaskStatus,
+  EnumUserGender,
+  EnumBillingMethodText,
+  EnumUserGenderText,
+  EnumSettlementCycleText,
+  BillingMethodEnumUnit,
+  EnumTaskUserHireStatus,
+} from '@12333/constants';
+import dayjs from 'dayjs';
+import { TaskUtils, toThousand } from '@12333/utils';
+import { TaskPrice } from '@12333/components';
+
+defineOptions({
+  name: 'ReserveServiceCard',
+});
+
+type Props = {
+  /** Id */
+  id?: string;
+  /** 浠诲姟鍚嶇О */
+  name: string;
+  /** 浠诲姟鍗曞彿 */
+  code?: string;
+  billingMethod?: EnumBillingMethod;
+  /** 鏈嶅姟璐� */
+  serviceFee?: number;
+  settlementCycle?: EnumSettlementCycle;
+  /** 绂忓埄 */
+  benefits?: API.GetTaskInfoQueryResultBenefit[];
+  genderLimit?: EnumUserGender;
+  /** 璧勬牸璇佷功绫诲瀷 */
+  credentialLimits?: API.GetTaskInfoQueryResultCredentialLimit[];
+  /** 浠诲姟鍦扮偣鎵�灞炵渷浠界紪鍙� */
+  provinceCode?: string;
+  /** 浠诲姟鍦扮偣鎵�灞炵渷浠� */
+  provinceContent?: string;
+  /** 浠诲姟鍦扮偣鎵�灞炲煄甯傜紪鍙� */
+  cityCode?: string;
+  /** 浠诲姟鍦扮偣鎵�灞炲煄甯� */
+  cityContent?: string;
+  /** 浠诲姟鍦扮偣鍚嶇О */
+  addressName?: string;
+  /** 浠诲姟鍦扮偣璇︾粏鍦板潃 */
+  addressDetail?: string;
+  /** 缁忓害 */
+  longitude?: number;
+  /** 绾害 */
+  latitude?: number;
+  /** 鎶ュ悕浜烘暟 */
+  userCount?: number;
+  status?: EnumTaskStatus;
+  /** 浠诲姟寮�濮嬫椂闂� */
+  beginTime?: string;
+  /** 浠诲姟缁撴潫鏃堕棿 */
+  endTime?: string;
+  releaseStatus?: EnumTaskReleaseStatus;
+  checkReceiveStatus?: EnumTaskCheckReceiveStatus;
+  settlementStatus?: EnumTaskSettlementStatus;
+  recommendStatus?: EnumTaskRecommendStatus;
+  /** 鍒涘缓鏃堕棿 */
+  createdTime?: string;
+  hireStatus?: EnumTaskUserHireStatus;
+
+  unRead?: boolean;
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  showActions: true,
+
+  unRead: false,
+});
+
+const emit = defineEmits<{
+  (e: 'apply', id: string): void;
+}>();
+</script>
+
+<style lang="scss">
+@import '@/styles/common.scss';
+
+.reserve-service-card-wrapper {
+  padding: 24px 32px;
+  margin-bottom: 24px;
+  background-color: #fff;
+  border-radius: 12px;
+
+  .task-price {
+    color: boleGetCssVar('color', 'danger');
+  }
+
+  &.un-read {
+    position: relative;
+
+    &::before {
+      content: '';
+      position: absolute;
+      width: 12px;
+      height: 12px;
+      border-radius: 50%;
+      background-color: red;
+      right: 18px;
+      top: 12px;
+    }
+  }
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+
+  .reserve-service-card-title-wrapper {
+    display: flex;
+    align-items: center;
+    margin-bottom: 14px;
+
+    .reserve-service-card-title {
+      flex: 1;
+      min-width: 0;
+      @include ellipsis;
+      font-size: 30px;
+      color: boleGetCssVar('text-color', 'primary');
+      line-height: 42px;
+    }
+  }
+
+  .reserve-service-card-item-list {
+    margin-bottom: 6px;
+
+    .reserve-service-card-item {
+      font-size: 24px;
+      color: boleGetCssVar('text-color', 'regular');
+      line-height: 36px;
+      margin-bottom: 6px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  .reserve-service-card-footer {
+    display: flex;
+    align-items: center;
+
+    .reserve-service-card-left {
+      flex: 1;
+      min-width: 0;
+      display: flex;
+      align-items: center;
+
+      .reserve-service-card-footer-address {
+        font-size: 24px;
+        color: boleGetCssVar('text-color', 'regular');
+        line-height: 36px;
+        flex: 1;
+        min-width: 0;
+        @include ellipsis;
+      }
+    }
+
+    .reserve-service-card-status {
+      font-size: 32px;
+      color: boleGetCssVar('text-color', 'regular');
+      line-height: 36px;
+    }
+  }
+}
+</style>

--
Gitblit v1.10.0