feat：index.scss 增加 .yd-search-form 全局样式，并更新相应的 search-form.vue 们

src/pages-infra/apiAccessLog/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索日志
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           用户编号
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           应用名
         </view>
         <wd-input
@@ -40,7 +40,7 @@
         />
       </view>
       <!-- TODO @芋艿：后续增加时间范围的检索 -->
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-infra/apiErrorLog/components/search-form.vue

@@ -10,16 +10,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索日志
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           用户编号
         </view>
         <wd-input
@@ -28,8 +28,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           应用名
         </view>
         <wd-input
@@ -38,8 +38,8 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           处理状态
         </view>
         <wd-radio-group v-model="formData.processStatus" shape="button">
@@ -57,7 +57,7 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-system/dept/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索部门
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           部门名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -46,7 +46,7 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-system/menu/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索菜单
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           菜单名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           菜单状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -39,7 +39,7 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-system/notice/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索通知公告
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           公告标题
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           公告状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -46,7 +46,7 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-system/operate-log/modules/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索操作日志
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           操作人
         </view>
         <UserPicker
@@ -30,8 +30,8 @@
           placeholder="请选择操作人员"
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           操作模块
         </view>
         <wd-input
@@ -40,8 +40,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           操作名
         </view>
         <wd-input
@@ -50,8 +50,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           操作内容
         </view>
         <wd-input
@@ -60,23 +60,19 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           操作时间
         </view>
-        <view class="flex items-center gap-16rpx">
+        <view class="yd-search-form-date-range-container">
           <view class="flex-1" @click="visibleCreateTime[0] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[0]) || '开始日期' }}
             </view>
           </view>
-          <text class="text-28rpx text-[#999]">至</text>
+          -
           <view class="flex-1" @click="visibleCreateTime[1] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[1]) || '结束日期' }}
             </view>
           </view>
@@ -87,7 +83,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[0]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[0]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime0Cancel">
             取消
           </wd-button>
@@ -101,7 +97,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[1]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[1]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime1Cancel">
             取消
           </wd-button>
@@ -110,8 +106,8 @@
           </wd-button>
         </view>
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           业务编号
         </view>
         <wd-input
@@ -120,7 +116,7 @@
           clearable
         />
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>
@@ -224,6 +220,4 @@ function handleReset() {
   visible.value = false
   emit('reset')
 }
-
-
 </script>

src/pages-system/post/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索岗位
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           岗位名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           岗位编码
         </view>
         <wd-input
@@ -39,8 +39,8 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -56,7 +56,7 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-system/role/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索角色
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           角色名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           角色标识
         </view>
         <wd-input
@@ -39,8 +39,8 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -56,7 +56,7 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages-system/user/components/search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索用户
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           用户名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           用户昵称
         </view>
         <wd-input
@@ -39,7 +39,7 @@
           clearable
         />
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages/bpm/components/copy-search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索流程
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程名称
         </view>
         <wd-input
@@ -29,23 +29,19 @@
           clearable
         />
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           抄送时间
         </view>
-        <view class="flex items-center gap-16rpx">
+        <view class="yd-search-form-date-range-container">
           <view class="flex-1" @click="visibleCreateTime[0] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[0]) || '开始日期' }}
             </view>
           </view>
-          <text class="text-28rpx text-[#999]">至</text>
+          -
           <view class="flex-1" @click="visibleCreateTime[1] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[1]) || '结束日期' }}
             </view>
           </view>
@@ -56,7 +52,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[0]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[0]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime0Cancel">
             取消
           </wd-button>
@@ -70,7 +66,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[1]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[1]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime1Cancel">
             取消
           </wd-button>
@@ -79,7 +75,7 @@
           </wd-button>
         </view>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages/bpm/components/done-search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索任务
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           任务名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view v-if="processDefinitionList.length > 0" class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view v-if="processDefinitionList.length > 0" class="yd-search-form-item">
+        <view class="yd-search-form-label">
           所属流程
         </view>
         <wd-picker
@@ -41,8 +41,8 @@
           label=""
         />
       </view>
-      <view v-if="categoryList.length > 0" class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view v-if="categoryList.length > 0" class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程分类
         </view>
         <wd-picker
@@ -53,8 +53,8 @@
           label=""
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           审批状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -66,24 +66,19 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <!-- DONE @AI：时时间范围，参考下 /Users/yunai/Java/yudao-ui-admin-uniapp-next/src/pages/message/components/search-form.vue -->
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           发起时间
         </view>
-        <view class="flex items-center gap-16rpx">
+        <view class="yd-search-form-date-range-container">
           <view class="flex-1" @click="visibleCreateTime[0] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[0]) || '开始日期' }}
             </view>
           </view>
-          <text class="text-28rpx text-[#999]">至</text>
+          -
           <view class="flex-1" @click="visibleCreateTime[1] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[1]) || '结束日期' }}
             </view>
           </view>
@@ -94,7 +89,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[0]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[0]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime0Cancel">
             取消
           </wd-button>
@@ -108,7 +103,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[1]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[1]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime1Cancel">
             取消
           </wd-button>
@@ -117,7 +112,7 @@
           </wd-button>
         </view>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages/bpm/components/my-search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索流程
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view v-if="processDefinitionList.length > 0" class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view v-if="processDefinitionList.length > 0" class="yd-search-form-item">
+        <view class="yd-search-form-label">
           所属流程
         </view>
         <wd-picker
@@ -41,24 +41,19 @@
           label=""
         />
       </view>
-      <!-- DONE @AI：时时间范围，参考下 /Users/yunai/Java/yudao-ui-admin-uniapp-next/src/pages/message/components/search-form.vue -->
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           发起时间
         </view>
-        <view class="flex items-center gap-16rpx">
+        <view class="yd-search-form-date-range-container">
           <view class="flex-1" @click="visibleCreateTime[0] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[0]) || '开始日期' }}
             </view>
           </view>
-          <text class="text-28rpx text-[#999]">至</text>
+          -
           <view class="flex-1" @click="visibleCreateTime[1] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[1]) || '结束日期' }}
             </view>
           </view>
@@ -69,7 +64,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[0]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[0]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime0Cancel">
             取消
           </wd-button>
@@ -83,7 +78,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[1]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[1]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime1Cancel">
             取消
           </wd-button>
@@ -92,8 +87,8 @@
           </wd-button>
         </view>
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -105,8 +100,8 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view v-if="categoryList.length > 0" class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view v-if="categoryList.length > 0" class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程分类
         </view>
         <wd-picker
@@ -117,7 +112,7 @@
           label=""
         />
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages/bpm/components/todo-search-form.vue

@@ -11,16 +11,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索任务
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           任务名称
         </view>
         <wd-input
@@ -29,8 +29,8 @@
           clearable
         />
       </view>
-      <view v-if="processDefinitionList.length > 0" class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view v-if="processDefinitionList.length > 0" class="yd-search-form-item">
+        <view class="yd-search-form-label">
           所属流程
         </view>
         <wd-picker
@@ -41,8 +41,8 @@
           label=""
         />
       </view>
-      <view v-if="categoryList.length > 0" class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view v-if="categoryList.length > 0" class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程分类
         </view>
         <wd-picker
@@ -53,8 +53,8 @@
           label=""
         />
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           流程状态
         </view>
         <wd-radio-group v-model="formData.status" shape="button">
@@ -66,24 +66,19 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <!-- DONE @AI：时时间范围，参考下 /Users/yunai/Java/yudao-ui-admin-uniapp-next/src/pages/message/components/search-form.vue -->
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           发起时间
         </view>
-        <view class="flex items-center gap-16rpx">
+        <view class="yd-search-form-date-range-container">
           <view class="flex-1" @click="visibleCreateTime[0] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[0]) || '开始日期' }}
             </view>
           </view>
-          <text class="text-28rpx text-[#999]">至</text>
+          -
           <view class="flex-1" @click="visibleCreateTime[1] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[1]) || '结束日期' }}
             </view>
           </view>
@@ -94,7 +89,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[0]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[0]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime0Cancel">
             取消
           </wd-button>
@@ -108,7 +103,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[1]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[1]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime1Cancel">
             取消
           </wd-button>
@@ -117,7 +112,7 @@
           </wd-button>
         </view>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/pages/message/components/search-form.vue

@@ -18,16 +18,16 @@
   <wd-popup
     v-model="visible"
     position="top"
-    custom-style="border-radius: 0 0 24rpx 24rpx;"
+    custom-style="border-radius: var(--yd-search-form-popup-radius);"
     safe-area-inset-top
     @close="visible = false"
   >
-    <view class="p-32rpx">
-      <view class="mb-24rpx text-32rpx text-[#333] font-semibold">
+    <view class="yd-search-form-container">
+      <view class="yd-search-form-title">
         搜索消息
       </view>
-      <view class="mb-24rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           已读状态
         </view>
         <wd-radio-group v-model="formData.readStatus" shape="button">
@@ -42,23 +42,19 @@
           </wd-radio>
         </wd-radio-group>
       </view>
-      <view class="mb-32rpx">
-        <view class="mb-12rpx text-28rpx text-[#666]">
+      <view class="yd-search-form-item">
+        <view class="yd-search-form-label">
           发送时间
         </view>
-        <view class="flex items-center gap-16rpx">
+        <view class="yd-search-form-date-range-container">
           <view class="flex-1" @click="visibleCreateTime[0] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[0]) || '开始日期' }}
             </view>
           </view>
-          <text class="text-28rpx text-[#999]">至</text>
+          -
           <view class="flex-1" @click="visibleCreateTime[1] = true">
-            <view
-              class="h-72rpx flex items-center justify-center rounded-8rpx bg-[#f5f5f5] px-24rpx text-28rpx"
-            >
+            <view class="yd-search-form-date-range-picker">
               {{ formatDate(formData.createTime?.[1]) || '结束日期' }}
             </view>
           </view>
@@ -69,7 +65,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[0]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[0]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime0Cancel">
             取消
           </wd-button>
@@ -83,7 +79,7 @@
           type="date"
           :columns-height="200"
         />
-        <view v-if="visibleCreateTime[1]" class="mt-16rpx flex justify-end gap-16rpx">
+        <view v-if="visibleCreateTime[1]" class="yd-search-form-date-range-actions">
           <wd-button size="small" plain @click="handleCreateTime1Cancel">
             取消
           </wd-button>
@@ -92,7 +88,7 @@
           </wd-button>
         </view>
       </view>
-      <view class="w-full flex justify-center gap-24rpx">
+      <view class="yd-search-form-actions">
         <wd-button class="flex-1" plain @click="handleReset">
           重置
         </wd-button>

src/style/index.scss

@@ -9,14 +9,6 @@
   color: red;
 }
 
-// ==================== 全局公共样式 ====================
-
-// 页面容器：灰色背景 + 最小全屏高度
-.page-container {
-  @apply min-h-screen;
-  background-color: #f5f5f5;
-}
-
 :root,
 page {
   // 修改按主题色
@@ -24,6 +16,9 @@ page {
 
   // 修改按钮背景色
   // --wot-button-primary-bg-color: green;
+
+  // yd-search-form：搜索表单弹窗圆角
+  --yd-search-form-popup-radius: 0 0 24rpx 24rpx;
 }
 
 /*
@@ -42,3 +37,60 @@ border-t-1
 //   border-style: solid; /* 2 */
 //   border-color: var(--un-default-border-color, #e5e7eb); /* 3 */
 // }
+
+// ==================== 全局公共样式 ====================
+
+// 页面容器：灰色背景 + 最小全屏高度
+.page-container {
+  @apply min-h-screen;
+  background-color: #f5f5f5;
+}
+
+// ==================== 搜索表单弹窗样式 ====================
+.yd-search-form {
+  // 弹窗容器
+  &-container {
+    @apply p-32rpx;
+  }
+
+  // 弹窗标题
+  &-title {
+    @apply mb-24rpx text-32rpx font-semibold;
+    color: #333;
+  }
+
+  // 表单项
+  &-item {
+    @apply mb-24rpx;
+  }
+
+  // 表单项标签
+  &-label {
+    @apply mb-12rpx text-28rpx;
+    color: #666;
+  }
+
+  // 底部按钮组
+  &-actions {
+    @apply w-full flex justify-center gap-24rpx;
+  }
+
+  // 日期范围选择器
+  &-date-range {
+    // 容器
+    &-container {
+      @apply flex items-center gap-16rpx;
+    }
+
+    // 日期选择框
+    &-picker {
+      @apply h-72rpx flex flex-1 items-center justify-center rounded-8rpx px-24rpx text-28rpx;
+      background-color: #f5f5f5;
+    }
+
+    // 确认按钮组
+    &-actions {
+      @apply mt-16rpx flex justify-end gap-16rpx;
+    }
+  }
+}