sadjv3_jishi/pages/index/wljl.vue

146 lines
4.0 KiB
Vue

<template>
<view class="content">
<view class="fenlei">
<u-search class="flex-sub" placeholder="请输入物料名称" :focus="false" shape="square" v-model="materialName"
:show-action="true" :animation="true" bg-color="#fff" color="#019c88" @search="onSearch()"
action-text="搜索" @custom="onSearch()" @clear="clear">
</u-search>
</view>
<!-- <mescroll-body :sticky="true" ref="mescrollRef" @up="upCallback"> -->
<t-refresh ref="refresh" v-if="listData.length>0" @refresh="refresh" @loadMore="loadMore" :loadingType="loadingType" :tPadding="0" >
<template slot="content" >
<!-- 数据列表 -->
<view class="margin-sm padding-sm bg radius " v-for="(item,index) in listData" :key='index'>
<view class="flex">
<view style="width: 160upx;height: 160upx;border-radius: 20rpx;">
<image :src="item.materiaImg?item.materiaImg:'../../static/logo.png'"
style="width: 220upx;height: 160upx;border-radius: 20rpx;"></image>
</view>
<view class="u-flex-1 text-white margin-left-sm">
<view style="color: #333333;font-size: 32upx;">{{item.recordDescribe}}</view>
<view style="font-size: 26upx;color: #999999;margin-top: 16rpx;" class="">{{item.materialName}} - {{item.createTime}}</view>
</view>
</view>
</view>
</template>
</t-refresh>
<empty v-if="listData.length == 0"></empty>
<!-- </mescroll-body> -->
</view>
</template>
<script>
import empty from '@/components/empty.vue'
import tRefresh from "@/components/t-refresh/t-refresh.vue"
export default {
components:{empty},
data(){
return{
loadingType:0,
page:1,
limit:10,
listData:[],
createTime:'',
materialName:'',
artificerId:''
}
},
onLoad(e) {
console.log('物料记录');
this.artificerId = uni.getStorageSync("artificerId");
this.getData()
},
onPullDownRefresh: function() {
this.page = 1;
this.getData();
},
methods:{
getData(){
var that=this;
let data = {
artificerId:that.artificerId,
createTime:that.createTime,
materialName:that.materialName,
page: that.page,
limit: that.limit,
}
that.$Request.getT('/app/material/selectMaterialRecord', data).then(res => {
if (res.code == 0) {
if (that.page == 1) that.listData = []; //如果是第一页需手动制空列表
that.listData = [...that.listData, ...res.data.list]; //追加新数据
} else {
that.$queue.showToast(res.msg);
}
});
},// 加载更多
loadMore: async function() {
this.loadingType=2
//模拟数据请求
setTimeout(()=>{
console.log(1);
this.page++;
this.loadingType=0;
let data = {
artificerId:this.artificerId,
createTime:this.createTime,
materialName:this.materialName,
page: this.page,
limit: this.limit,
}
this.$Request.getT('/app/material/selectMaterialRecord', data).then(res => {
if (res.code == 0) {
if (this.page == 1) this.listData = []; //如果是第一页需手动制空列表
if(res.data.totalPage >= this.page){
this.listData = [...this.listData, ...res.data.list]; //追加新数据
}else{
this.$queue.showToast("暂无更多数据");
this.page = res.data.totalPage
}
} else {
this.$queue.showToast(res.msg);
}
});
},1000)
},
clear(res) {
let that = this
that.listData = [];
that.page = 1;
that.materialName = '';
that.getData()
},
onSearch(e) {
// this.artificerName = e;
this.page = 1;
this.getData();
},
}
}
</script>
<style scoped>
.content{
width: 100%;
/* height: 100vh; */
background-color: white;
overflow: hidden;
}
.fenlei{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
margin-top: 10rpx;
margin-bottom: 10rpx;
}
.screen-button{
// border: 1px solid #019c88;
color: #019c88;
padding:5rpx 10rpx;
margin:0 18rpx;
border-radius:6rpx;
}
</style>