feat(survey): 优化问卷列表页面

- 添加搜索功能，用户可以按项目名称搜索问卷
- 调整问卷列表项的样式，优化布局
- 移除多余的 padding 样式
- 更新 base.scss 中的变量定义

src/assets/css/base.scss

@@ -21,6 +21,7 @@
   --van-cascader-active-color: var(--primary-color);
   --status-bar-height: 20px;
   --sticky-top-height: calc(var(--status-bar-height) + calc(var(--van-nav-bar-height) + 13px));
+  --van-radius-sm: 16px;
 }
 
 /* semantic color variables for this project */

src/assets/css/public.scss

@@ -5,7 +5,7 @@
 }
 
 .van-cell {
-  padding: 8px !important;
+  //padding: 8px !important;
 }
 
 .van-divider {

src/views/Survey/Index.vue

@@ -1,6 +1,13 @@
 <template>
   <div class="survey-search">
-    <van-search class="theme-background" :border="false" background="#71b73c"></van-search>
+    <van-search
+      class="theme-background"
+      :border="false"
+      background="#71b73c"
+      v-model="searchValue"
+      @blur="blurs"
+      @search="blurs"
+    ></van-search>
   </div>
   <div class="new-survey-container container">
     <van-list
@@ -103,9 +110,18 @@ const loading = ref(false);
 const finished = ref(false);
 const form = ref({
   page: 0,
-  pageSize: 10
+  pageSize: 10,
+  project_name: ''
 });
 
+const searchValue = ref('');
+
+const blurs = () => {
+  form.value.page = 1;
+  form.value.project_name = searchValue.value;
+  survey.value = [];
+  fetchSurveys();
+};
 const onLoad = () => {
   // 异步更新数据
   setTimeout(() => {
@@ -113,11 +129,12 @@ const onLoad = () => {
     fetchSurveys();
   }, 500);
 };
-const fetchSurveys = async() => {
+const fetchSurveys = async () => {
   const params = {
     page: form.value.page,
     per_page: form.value.pageSize,
-    group_id: 0
+    group_id: 0,
+    project_name: searchValue.value
   };
   const res = await getSurveysPage(params);
   if (res.data.code === 0) {
@@ -150,7 +167,7 @@ const deleteItem = (item) => {
     showCancelButton: true,
     confirmButtonColor: '#03B03C'
   })
-    .then(async() => {
+    .then(async () => {
       const res = await deleteSurveys(item.sn);
       if (res.data.message) {
         showToast(res.data.message);
@@ -174,7 +191,7 @@ const copyItem = (item) => {
     showCancelButton: true,
     confirmButtonColor: '#03B03C'
   })
-    .then(async() => {
+    .then(async () => {
       const res = await copySurveys(item.sn);
       if (res.data.code === 200 || res.data.code === 201) {
         showSuccessToast('复制成功');
@@ -215,7 +232,7 @@ const editItem = (item) => {
   });
 };
 // 保存为模板
-const saveTemplate = async(item) => {
+const saveTemplate = async (item) => {
   const data = JSON.parse(JSON.stringify(item));
   const res = await saveTemplates(item.sn, data);
   if (res.data.code === 200 || res.data.code === 201) {
@@ -259,12 +276,12 @@ onMounted(() => {
 
 .new-survey-container {
   //min-height: calc(100vh - 100px);
-  padding: 1px;
+  //padding: 1px;
 
   //background: linear-gradient(to bottom, $theme-color 200px, #f2f2f2 300px);
 
   .new-survey_item {
-    margin: 10px;
+    margin: 0 10px 10px 10px;
     padding: 10px 0 8px 7px;
     border-radius: 8px;
     background-color: white;
@@ -354,5 +371,9 @@ onMounted(() => {
       }
     }
   }
+
+  .new-survey_item + .new-survey_item {
+    margin: 0 10px 10px 10px;
+  }
 }
 </style>