feat(mobile_view/promotion): 增加计划列表卡片效果

src/mobile_views/promotion/index.vue

 <template>
-  <div>
+  <div class="mobile-container">
     <van-nav-bar title="活动计划"
       right-text="搜索"
       @click-right="showSearch = true" />
+    <!-- 计划列表 -->
+    <van-list v-model:loading="loading"
+      :finished="finished"
+      :immediate-check="false"
+      finished-text="没有更多了"
+      @load="onLoad">
+      <van-cell-group inset>
+        <van-cell v-for="item in planList"
+          :key="item.id"
+          :title="item.employeeName"
+          :value="item.pattern"
+          :label="item.storeName"
+          @click="detailFn" />
+      </van-cell-group>
+    </van-list>
+
     <van-popup v-model:show="showSearch"
       position="right"
       :style="{ height: '100vh' }">
@@ -101,7 +117,7 @@
 <script setup>
 import { parseTime } from '@/utils'
 import { useDatePickerOptions } from '@/hooks'
-import { getChargeListAPI } from '@/api'
+import { getChargeListAPI, getPlanListAPI } from '@/api'
 const { recentPickerOptions: pickerOptions, thisYearDate } = useDatePickerOptions(0)
 
 
@@ -205,11 +221,53 @@ const onEmployeeConfirm = (val) => {
   employeeIdStr.value = val.selectedValues
   employeeIdShowPicker.value = false
 }
+
+// 计划列表
+const planQueryParams = reactive({
+  pageNum: 1,
+  pageSize: 10
+})
+const planList = ref([])
+const loading = ref(false)
+const finished = ref(false)
+const getPlanList = async () => {
+  loading.value = true
+  const res = await getPlanListAPI(planQueryParams)
+  planList.value = [...planList.value, ...res.data.records]
+  finished.value = res.data.records.length === 0
+  loading.value = false
+}
+getPlanList()
+const onLoad = () => {
+  planQueryParams.pageNum++
+  getPlanList()
+}
+const detailFn = () => {
+
+}
 </script>
 
 <style scoped
   lang="scss">
+  .mobile-container{
+    background: #f5f5f5;
+    .van-cell-group{
+      background: #f5f5f5;
+    }
+    .van-cell{
+      margin-top: 10px;
+      ::v-deep(.van-cell__label){
+        /* 强制一行显示 */
+        white-space: nowrap;
+      }
+    }
+  }
   ::v-deep(.van-field):first-of-type {
+    .van-button {
+      margin: 0 5px;
+      padding: 0 5px;
+    }
+
     .van-cell__right-icon:first-of-type {
       display: none;
     }