```

feat(workflowTrade): 新增工作流列表查询和搜索功能

- 新增 getQuestList API 接口用于查询寻找工作流列表
- 实现工作流页面的搜索功能，添加搜索输入框和按钮
- 添加分页功能，使用 searchFom 统一管理分页参数
- 动态显示列表总数，替换原有的静态数字
- 在新增页面将树形选择器替换为级联选择器，优化分类选择体验
- 添加预算字段的输入验证规则，支持小数格式验证
- 移除手机号输入框的 number 类型限制
- 使用 watchEffect 监听分类选择变化并同步到表单数据
```

src/api/workflowTrade.js

@@ -3,4 +3,9 @@ import request from './request.js'
 // 新增需求工作流
 export function questAdd(data = {}) {
   return request.post('/quest',data)
+}
+
+// 查询寻找工作流列表
+export function getQuestList(data = {}) {
+  return request.get('/quest/list',data)
 }

src/pages/workflowTrade/workflowTrade.vue

@@ -8,10 +8,11 @@
           <div class="search-input-container flex_1">
             <input
               type="text"
+              v-model="searchFom.title"
               :placeholder="$t('common.qingshuruyaosousuodegongzuoliu')"
               class="search-input"
             />
-            <button class="search-btn bg_color_primary">
+            <button class="search-btn bg_color_primary" @click="getList('init')">
               <img :src="searchIcon" alt="" class="icon-search">
               {{$t('common.shousuo')}}
             </button>
@@ -42,7 +43,7 @@
       </div>
       <!-- 列表 -->
       <div class="course-list mt20">
-        <div class="font_size20 bold mb10">共 <span class="color_theme">5</span> 条需求</div>
+        <div class="font_size20 bold mb10">共 <span class="color_theme">{{listTotal}}</span> 条需求</div>
         <div class="padding16 bg_color_fff border_radius_16 mb20 box_shadow_card list_item_animation" 
           v-for="item in 4" :key="item"
         >
@@ -98,9 +99,9 @@
       <!-- 分页 -->
       <!-- 替换原有的分页代码 -->
       <Pagination 
-        :total="pagination.total"
-        :page-size="pagination.pageSize"
-        :current-page="pagination.currentPage"
+        :total="searchFom.total"
+        :page-size="searchFom.pageSize"
+        :current-page="searchFom.pageNum"
         @page-change="handlePageChange"
       />
     </div>
@@ -119,13 +120,15 @@
   import zaixianbaomingIcon from '@/assets/imgs/zaixianbaoming.png'
 
   import Pagination from '@/components/Pagination.vue'
+  import { getQuestList } from '@/api/workflowTrade.js'
+
 
 
   import { useRouter, useRoute } from 'vue-router'
   const router = useRouter()
   const route = useRoute()
   console.log(router,route)
-  import { ref, computed, reactive } from 'vue'
+  import { ref, computed, reactive, onMounted } from 'vue'
   import { useAppStore } from '@/pinia/appStore'
   const appStore = useAppStore()
 
@@ -138,17 +141,36 @@
     return route.matched.length > 1
   })
   // 添加分页相关数据
-  const pagination = reactive({
-    currentPage: 1,
+  const list = ref([])
+  const listTotal = ref(0)
+  const searchFom = reactive({
+    categoryId1: '',
+    categoryId2: '',
+    categoryId3: '',
+    title: '',
+    pageNum: 1,
     pageSize: 10,
-    total: 100
+  })
+  onMounted(() => {
+    getList();
   })
   const handlePageChange = (page) => {
-    pagination.currentPage = page
+    searchFom.pageNum = page
     // 这里可以添加获取数据的逻辑
-    console.log('当前页:', page)
+    console.log('当前页:', page);
+    getList();
+  }
+  // 查询寻找工作流列表
+  const getList = async (type) => {
+    if(type === 'init'){
+      searchFom.pageNum = 1
+    }
+    const res = await getQuestList(searchFom)
+    if(res.code === 200){
+      // listTotal.value = res.data.total
+      // list.value = res.data.records
+    }
   }
-
 
   const goworkflowTradeDetail = (item={}) => {
     //增加参数名称

src/pages/workflowTrade/workflowTradeAdd.vue

@@ -27,14 +27,14 @@
                 <div>
                   <span class="color_required font_size16">*</span>
                   <span class="font_size16 bold">工作流类型</span>
-                  <span class="font_size14 gray999 ml20">选择最贴合的工作流分类</span>
+                  <span class="font_size14 gray999 ml20">选择最贴合的工作流分类{{ruleForm.categoryId3}}</span>
                 </div>
                 <!-- 树形选择 -->
-                <el-tree-select 
-                  v-model="ruleForm.categoryId3"
-                  :data="categoryListTree"
-                  :render-after-expand="false"
+                <el-cascader 
+                  v-model="categoryIdList"
+                  :options="categoryListTree"
                   placeholder="请选择工作流类型"
+                  style="width:100%"
                   :props="{
                     label: 'categoryName',
                     value: 'categoryId',
@@ -76,7 +76,7 @@
             <div class="mt10">
               <el-row :gutter="20">
                 <el-col :span="12">
-                  <el-form-item label="">
+                  <el-form-item label="" prop="budgetMin">
                     <div>
                       <span class="font_size16 bold">预算下限(元)</span>
                       <span class="font_size14 gray999 ml20">选填，有助于吸引合适的服务者</span>
@@ -85,7 +85,7 @@
                   </el-form-item>
                 </el-col>
                 <el-col :span="12">
-                  <el-form-item label="">
+                  <el-form-item label="" prop="budgetMax">
                     <div>
                       <span class="font_size16 bold">预算上限(元)</span>
                       <span class="font_size14 gray999 ml20">选填，有助于吸引合适的服务者</span>
@@ -114,7 +114,7 @@
             </div>  
             <div class="mt10">
               <el-form-item label="手机号" prop="phone">
-                <el-input v-model="ruleForm.phone" placeholder="请输入手机号"  maxlength="11" type="number" />
+                <el-input v-model="ruleForm.phone" placeholder="请输入手机号"  maxlength="11"/>
               </el-form-item>
               <el-form-item label="微信">
                 <el-input v-model="ruleForm.wechat" placeholder="请输入微信号"  maxlength="50"/>
@@ -190,7 +190,7 @@ import { useRouter, useRoute } from 'vue-router'
 const router = useRouter()
 const route = useRoute()
 console.log(router,route)
-import { ref, computed, reactive, onMounted } from 'vue'
+import { ref, computed, reactive, onMounted, watchEffect } from 'vue'
 import { useAppStore } from '@/pinia/appStore'
 const appStore = useAppStore()
 
@@ -198,10 +198,15 @@ const appStore = useAppStore()
 const query = route.query;
 // 分类列表树
 const categoryListTree = ref([]);
+// 选择的分类id列表
+const categoryIdList = ref([])
+
 // 表单实例
 const ruleFormRef = ref(null)
 const ruleForm = reactive({
   title: '',
+  categoryId1: '',
+  categoryId2: '',
   categoryId3: '',
   background: '',
   requirements: '',
@@ -212,13 +217,19 @@ const ruleForm = reactive({
   wechat: '',
   email: '',
 })
+watchEffect(() => {
+  // 将选择的分类id列表赋值给表单的categoryId1、categoryId2、categoryId3
+  ruleForm.categoryId1 = categoryIdList.value[0] || ''
+  ruleForm.categoryId2 = categoryIdList.value[1] || ''
+  ruleForm.categoryId3 = categoryIdList.value[2] || ''
+})
 // 校验规则
 const rules = reactive({
   title: [
     { required: true, message: '请输入需求标题', trigger: 'blur' },
   ],
   categoryId3: [
-    { required: true, message: '请选择工作流类型', trigger: 'change' },
+    { required: true, message: '请选择工作流类型', trigger: 'blur' },
   ],
   background: [
     { required: true, message: '请输入需求背景', trigger: 'blur' },
@@ -227,10 +238,12 @@ const rules = reactive({
     { required: true, message: '请输入具体要求', trigger: 'blur' },
   ],
   budgetMin: [
-    { required: true, message: '请输入预算下限', trigger: 'blur' },
+    // { required: true, message: '请输入预算下限', trigger: 'blur' },
+    { validator: (rule, value, callback) => /^\d+(\.\d{1,2})?$/.test(value), message: '请输入正确的预算下限（最多两位小数）', trigger: 'blur' },
   ],
   budgetMax: [
-    { required: true, message: '请输入预算上限', trigger: 'blur' },
+    // { required: true, message: '请输入预算上限', trigger: 'blur' },
+    { validator: (rule, value, callback) => /^\d+(\.\d{1,2})?$/.test(value), message: '请输入正确的预算上限（最多两位小数）', trigger: 'blur' },
   ],
   deadline: [
     { required: true, message: '请选择报名截止时间', trigger: 'change' },