hookehuyr

申领物资页面新增组别切换

1 <!-- 1 <!--
2 * @Date: 2024-07-23 12:53:15 2 * @Date: 2024-07-23 12:53:15
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-07-23 14:27:11 4 + * @LastEditTime: 2024-07-23 16:12:12
5 * @FilePath: /temple_material_request/src/views/material_request.vue 5 * @FilePath: /temple_material_request/src/views/material_request.vue
6 * @Description: 申领物资页面 6 * @Description: 申领物资页面
7 --> 7 -->
8 <template> 8 <template>
9 <div class="material-request-page"> 9 <div class="material-request-page">
10 + <van-tabs v-model:active="active" @change="onChange" sticky :color="styleColor.baseColor">
11 + <van-tab v-for="index in 8" :title="'标签 ' + index">
12 + <van-list
13 + v-model:loading="loading"
14 + :finished="finished"
15 + finished-text="没有更多了"
16 + @load="onLoad"
17 + >
10 <div class="list-wrapper"> 18 <div class="list-wrapper">
19 + <van-sticky :offset-top="44">
11 <van-row justify="space-between" class="select-all-item"> 20 <van-row justify="space-between" class="select-all-item">
12 <van-col span="8"><van-icon name="passed" size="1.25rem" />&nbsp;&nbsp;<span :style="{ color: styleColor.baseColor }">全选</span></van-col> 21 <van-col span="8"><van-icon name="passed" size="1.25rem" />&nbsp;&nbsp;<span :style="{ color: styleColor.baseColor }">全选</span></van-col>
13 <van-col span="16" style="text-align: right; font-size: 0.85rem; color: #666666;">参考上次同类活动的领用情况</van-col> 22 <van-col span="16" style="text-align: right; font-size: 0.85rem; color: #666666;">参考上次同类活动的领用情况</van-col>
14 </van-row> 23 </van-row>
24 + </van-sticky>
15 <van-list 25 <van-list
16 v-model:loading="loading" 26 v-model:loading="loading"
17 :finished="finished" 27 :finished="finished"
...@@ -31,8 +41,11 @@ ...@@ -31,8 +41,11 @@
31 </van-row> 41 </van-row>
32 </div> 42 </div>
33 </van-list> 43 </van-list>
34 - <div style="height: 5rem;"></div> 44 + <div style="height: 3rem;"></div>
35 </div> 45 </div>
46 + </van-list>
47 + </van-tab>
48 + </van-tabs>
36 <div class="control-bar"> 49 <div class="control-bar">
37 <div> 50 <div>
38 <van-button icon="plus" type="primary" :color="styleColor.baseColor" @click="addMore">添加更多</van-button> 51 <van-button icon="plus" type="primary" :color="styleColor.baseColor" @click="addMore">添加更多</van-button>
...@@ -64,6 +77,11 @@ useTitle($route.meta.title); ...@@ -64,6 +77,11 @@ useTitle($route.meta.title);
64 77
65 const num_value = ref(''); 78 const num_value = ref('');
66 79
80 +const active = ref(0);
81 +const onChange = (index) => {
82 + console.warn(index);
83 +}
84 +
67 const list = ref([]); 85 const list = ref([]);
68 const loading = ref(false); 86 const loading = ref(false);
69 const finished = ref(false); 87 const finished = ref(false);
...@@ -109,6 +127,8 @@ const goShoppingCart = () => { // 跳转购物车 ...@@ -109,6 +127,8 @@ const goShoppingCart = () => { // 跳转购物车
109 width: 100%; 127 width: 100%;
110 .select-all-item { 128 .select-all-item {
111 padding: 0.5rem 1rem; 129 padding: 0.5rem 1rem;
130 + border-top: 1px solid #f0f0f0;
131 + background-color: white;
112 } 132 }
113 .list-boxer { 133 .list-boxer {
114 margin: 0; padding: 1rem; border-top: 1px solid #f0f0f0; 134 margin: 0; padding: 1rem; border-top: 1px solid #f0f0f0;
......