183 lines
4.2 KiB
Vue
183 lines
4.2 KiB
Vue
<template>
|
|
<view class="popup-container" v-if="visible">
|
|
<view class="popup-content">
|
|
<scroll-view :scroll-top="scrollTop" direction="vertical" class="scroll-Y" scroll-with-animation="true"
|
|
@scrolltoupper="upper" @scrolltolower="lower" @scroll="scroll" @scrollend="end"
|
|
:show-scrollbar="showScrollbar">
|
|
<view v-for="(item, index) in matBaseInfoList" :key="index" class="list-item"
|
|
@click="onItemClick(item)">
|
|
{{ item.matCode }} - {{ item.matName }}
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<button class="button1" @click="handleClose">关 闭</button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getConfig
|
|
} from '@/config.js';
|
|
|
|
import {
|
|
saveConfig
|
|
} from '@/config.js';
|
|
|
|
import {
|
|
getServerIPAndPort
|
|
} from '@/config.js';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
visible: false,
|
|
matCodeCondition: '',
|
|
userName: '',
|
|
matBaseInfoList: [], // 用于存储物料数据的数组
|
|
scrollTop: 0,
|
|
showScrollbar: true
|
|
};
|
|
},
|
|
methods: {
|
|
show() {
|
|
this.visible = true;
|
|
this.matCodeCondition = getConfig('matCodeCondition', '');
|
|
console.log('scroll - view height:', this.matCodeCondition);
|
|
|
|
this.userName = getConfig('userName', '');
|
|
var serverIPAndPort = getServerIPAndPort();
|
|
|
|
//获取列表
|
|
uni.request({
|
|
url: 'http://' + serverIPAndPort + '/matBaseInfo/getMatBaseInfo', // 请求的接口地址
|
|
method: 'POST', // 设置请求方式为 POST
|
|
data: {
|
|
"MatCode": this.matCodeCondition,
|
|
"MatName": "",
|
|
"MatSpec": "",
|
|
"IsEnable": null,
|
|
"PageNumber": 1,
|
|
"PageSize": 300,
|
|
"UserName": this.userName,
|
|
"DeviceType": "PDA"
|
|
},
|
|
header: {
|
|
'Content-Type': 'application/json', // 如果需要以JSON格式发送数据
|
|
},
|
|
success: (res) => {
|
|
// 请求成功的回调函数
|
|
if (res.statusCode === 200) {
|
|
//接口返回数据为200 表示获取成功!
|
|
if (res.data.code == 200) {
|
|
if (res.data.data.lists != null && res.data.data.lists.length > 0) {
|
|
this.matBaseInfoList = res.data.data.lists;
|
|
console.log('matBaseInfoList:', this.matBaseInfoList);
|
|
} else {
|
|
this.visible = false;
|
|
this.matBaseInfoList = null;
|
|
uni.showToast({
|
|
title: '根据查询条件未查询到物料!',
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
}
|
|
} else {
|
|
this.visible = false;
|
|
this.matBaseInfoList = null;
|
|
uni.showToast({
|
|
title: '查询物料失败:' + res.data.message,
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
title: '查询物料失败:服务器返回错误状态码' + res.statusCode,
|
|
icon: 'none',
|
|
duration: 1500
|
|
});
|
|
}
|
|
},
|
|
fail: (err) => {
|
|
// 请求失败的回调函数
|
|
uni.showToast({
|
|
title: '请求失败:' + err.errMsg,
|
|
icon: 'none',
|
|
duration: 3000
|
|
});
|
|
},
|
|
complete: (event) => {
|
|
// 请求完成的回调函数(无论成功或失败都会调用)
|
|
console.log('请求完成', event);
|
|
}
|
|
});
|
|
},
|
|
handleClose() {
|
|
this.visible = false;
|
|
this.$emit('close');
|
|
},
|
|
onItemClick(item) {
|
|
uni.showToast({
|
|
title: '选择成功',
|
|
icon: 'none',
|
|
duration: 1200
|
|
});
|
|
this.visible = false;
|
|
this.$emit('selected', item);
|
|
},
|
|
upper() {
|
|
console.log('scrolltoupper');
|
|
},
|
|
lower() {
|
|
console.log('scrolltolower');
|
|
},
|
|
scroll() {
|
|
console.log('scroll');
|
|
},
|
|
end() {
|
|
console.log('scrollend');
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.list-item {
|
|
padding: 10px;
|
|
border-bottom: 1px solid #ccc;
|
|
font-size: 35rpx;
|
|
}
|
|
|
|
.popup-container {
|
|
width: 100%;
|
|
z-index: 2;
|
|
overflow: auto;
|
|
}
|
|
|
|
.popup-content {
|
|
border: black;
|
|
border-radius: 10rpx;
|
|
border: 1rpx solid black;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
width: 650rpx;
|
|
height: 600rpx;
|
|
background-color: white;
|
|
z-index: 2;
|
|
overflow: auto;
|
|
}
|
|
|
|
.button1 {
|
|
background-color: darkred;
|
|
color: white;
|
|
bottom: 0;
|
|
top: 80%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
height: 80rpx;
|
|
position: absolute;
|
|
|
|
}
|
|
</style> |