增加统一的列表处理类
This commit is contained in:
36
src/components/utils/list.js
Normal file
36
src/components/utils/list.js
Normal file
@@ -0,0 +1,36 @@
|
||||
import http from "./http";
|
||||
|
||||
class List {
|
||||
constructor(action) {
|
||||
this.action = action
|
||||
this.current = 1
|
||||
this.total = 0
|
||||
this.list = []
|
||||
}
|
||||
|
||||
getData(params) {
|
||||
const {action} = this
|
||||
return http.post(action, null, {params})
|
||||
}
|
||||
|
||||
init(params) {
|
||||
this.getData({...params, current: 1}).then(res => {
|
||||
if (res?.data) {
|
||||
this.list = res.data.records
|
||||
this.total = res.data.total
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
loadMore(params) {
|
||||
if (this.list.length < this.total) {
|
||||
this.getData({...params, current: ++this.current}).then(res => {
|
||||
if (res?.data) {
|
||||
this.list = [...this.list, ...res.data.records]
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default List
|
||||
@@ -22,11 +22,11 @@
|
||||
<u-icon name="arrow-down" size="28" color="#333333" :custom-style="{marginLeft:'8px'}"></u-icon>
|
||||
</span>
|
||||
<div class="total">
|
||||
共<em>{{ total }}</em>个农产品
|
||||
共<em>{{ list.total }}</em>个农产品
|
||||
</div>
|
||||
</header>
|
||||
<div class="card-list" v-if="list.length">
|
||||
<div class="card" v-for="(item,index) in list" :key="index" @click="toDetail(item)">
|
||||
<div class="card-list">
|
||||
<div class="card" v-for="(item,index) in list.list" :key="index" @click="toDetail(item)">
|
||||
<div class="top">
|
||||
<div class="title">{{ item.title }}
|
||||
</div>
|
||||
@@ -47,7 +47,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AiEmpty v-else/>
|
||||
<AiEmpty v-if="!list.list.length"/>
|
||||
<div class="btn-wrapper">
|
||||
<div class="btn" @click="suport" hover-class="text-hover">我要发布</div>
|
||||
</div>
|
||||
@@ -57,6 +57,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import List from "dvcp-wui/utils/list";
|
||||
|
||||
export default {
|
||||
name: "AppAgProducts",
|
||||
appName: "晒农产品",
|
||||
@@ -64,11 +66,9 @@ export default {
|
||||
return {
|
||||
index: 0,
|
||||
show: false,
|
||||
current: 1,
|
||||
type: "",
|
||||
typeName: "",
|
||||
list: [],
|
||||
total: 0,
|
||||
}
|
||||
},
|
||||
|
||||
@@ -96,7 +96,6 @@ export default {
|
||||
},
|
||||
onChange(val) {
|
||||
this.index = val;
|
||||
this.current = 1;
|
||||
if (!!this.index) {
|
||||
this.getMine();
|
||||
} else this.getAll();
|
||||
@@ -107,36 +106,19 @@ export default {
|
||||
confirm(val) {
|
||||
this.type = val[0].value;
|
||||
this.typeName = val[0].label;
|
||||
this.current = 1;
|
||||
if (!!this.index) {
|
||||
this.getMine();
|
||||
} else this.getAll();
|
||||
},
|
||||
getAll() {
|
||||
this.$instance.post("/app/appshowagriculturalproduce/list", null, {
|
||||
params: {
|
||||
type: this.type,
|
||||
current: this.current,
|
||||
}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records;
|
||||
this.total = res.data.total;
|
||||
}
|
||||
})
|
||||
const {type} = this
|
||||
this.list = new List("/app/appshowagriculturalproduce/list")
|
||||
this.list.init({type})
|
||||
},
|
||||
getMine() {
|
||||
this.$instance.post("/app/appshowagriculturalproduce/listByWx", null, {
|
||||
params: {
|
||||
type: this.type,
|
||||
current: this.current,
|
||||
}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records;
|
||||
this.total = res.data.total;
|
||||
}
|
||||
})
|
||||
const {type} = this
|
||||
this.list = new List("/app/appshowagriculturalproduce/listByWx")
|
||||
this.list.init({type})
|
||||
},
|
||||
toDetail({id}) {
|
||||
uni.navigateTo({
|
||||
@@ -150,7 +132,6 @@ export default {
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.current = 1;
|
||||
if (!!this.index) {
|
||||
this.getMine();
|
||||
} else {
|
||||
@@ -158,12 +139,8 @@ export default {
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current++;
|
||||
if (!!this.index) {
|
||||
this.getMine();
|
||||
} else {
|
||||
this.getAll();
|
||||
}
|
||||
const {type} = this
|
||||
this.list.loadMore({type})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -299,7 +276,6 @@ export default {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: 32px;
|
||||
|
||||
& > img {
|
||||
|
||||
@@ -16,7 +16,7 @@ const configs = {
|
||||
dev: {
|
||||
areaId: '341021104000',
|
||||
areaName: '郑村镇',
|
||||
baseUrl: 'http://192.168.1.87:59998'
|
||||
baseUrl: 'http://192.168.1.87:9000'
|
||||
}
|
||||
}
|
||||
// 当前选中配置
|
||||
|
||||
Reference in New Issue
Block a user