248 lines
6.3 KiB
Vue
248 lines
6.3 KiB
Vue
<template>
|
||
<view class="app status-bar-gap">
|
||
<view class="page">
|
||
<l-header :title="t('home.sctc')" sticky></l-header>
|
||
<view class="input-box">
|
||
<up-tabs :scrollable="state.scrollableTabState" :list="state.tabsList" @click="setScrollableTabStateFun"></up-tabs>
|
||
</view>
|
||
<view class="input-box">
|
||
<view class="input-item">
|
||
<up-input :placeholder="t('index.scddbh')" border="none" clearable inputAlign="left"
|
||
v-model="state.queryString" @change="changeFun" ref="inputRef">
|
||
<template #prefix>
|
||
<up-icon name="scan" color="#2979ff" size="24"></up-icon>
|
||
</template>
|
||
</up-input>
|
||
</view>
|
||
</view>
|
||
<view class="receive-listBox" ref="listBoxRef">
|
||
<scroll-view id="scroll-box" class="scroll-box" scroll-y="true"
|
||
:style="{'height':state.scrollHeight+'px'}" @scrolltolower="fnScrollBottom()">
|
||
<view class="list-box-list" v-if="state.dataList.length > 0">
|
||
<view class="data-item" v-for="(item, index) in state.dataList" :key="index" @click="clickPRD_MOViewIntoPro(item)">
|
||
<view class="tit">{{ t('index.scddbh') }}：{{item.FBillNo}}</view>
|
||
<view class="line-p"></view>
|
||
<view class="b-font">{{ t('receive.rq') }}：{{item.FDateFormat}}</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="state.dataList.length==0">
|
||
<up-empty mode="list"></up-empty>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { reactive, nextTick, onMounted, ref,computed } from 'vue';
|
||
import { onLoad, onShow, onReachBottom } from '@dcloudio/uni-app'
|
||
import { useI18n } from 'vue-i18n'
|
||
import { parseTime } from '../../utils/tools.js';
|
||
import { route } from '@/uni_modules/uview-plus';
|
||
import { PRDPPBOMList, PRD_MOList, PRD_MOViewIntoPro } from '../../common/request/api/api';
|
||
import { pageDataInfo } from '../../stores/info.js';
|
||
const pageDataInfoCom = pageDataInfo()
|
||
const listBoxRef = ref(null)
|
||
const getI18n = useI18n()
|
||
const { t, locale } = getI18n
|
||
const state = reactive({
|
||
queryString: '',
|
||
scrollableTabState: false,
|
||
dataList: [],
|
||
inputFocus: true,
|
||
scrollHeight: 0,
|
||
page: {
|
||
pageIndex: 1,
|
||
pageSize: 200,
|
||
totalCount: 0
|
||
},
|
||
type: '1',
|
||
tabsList: [
|
||
{ name: computed(() => t('home.kssc')),type: '1' },
|
||
{ name: computed(() => t('home.kscs')),type: '3' },
|
||
{ name: computed(() => t('home.kshb')),type: '2' },
|
||
]
|
||
})
|
||
onShow(() => {
|
||
state.queryString = ''
|
||
fnDataList()
|
||
})
|
||
onMounted(() => {
|
||
const query = uni.createSelectorQuery().in(this);
|
||
query.select(".receive-listBox").boundingClientRect((data) => {
|
||
state.scrollHeight = data.height
|
||
}).exec();
|
||
})
|
||
const setScrollableTabStateFun = (item:any) => {
|
||
state.type = item.type
|
||
}
|
||
const fnScrollBottom = () => {
|
||
console.log(state.page.pageIndex * state.page.pageSize, state.page.totalCount);
|
||
if (state.page.pageIndex * state.page.pageSize <= state.page.totalCount) {
|
||
state.page.pageIndex++;
|
||
uni.showLoading({ mask: true });
|
||
setTimeout(() => {
|
||
fnDataList();
|
||
}, 500);
|
||
}
|
||
}
|
||
const debounceTimer = ref()
|
||
const changeFun = (e : any) => {
|
||
if (debounceTimer.value !== null) clearTimeout(debounceTimer.value)
|
||
debounceTimer.value = setTimeout(() => {
|
||
state.queryString = e
|
||
state.page.pageIndex = 1
|
||
state.dataList = []
|
||
fnDataList(true)
|
||
}, 500)
|
||
}
|
||
const viewIntoProFun = (item : object,typeVertical:string = 'details') => {
|
||
PRD_MOViewIntoPro({
|
||
Number: state.queryString
|
||
}).then((res : any) => {
|
||
if (res.code === 200) {
|
||
if(typeVertical === 'details'){
|
||
pageDataInfoCom.putInProdPageData({ ...res.data, ...item, time: new Date().getTime(), type: state.type })
|
||
route({ url: '/pages/putInProd/details' })
|
||
}
|
||
if(typeVertical === 'item'){
|
||
if(state.type === '2'){
|
||
toPages('/pages/putInProd/print',{...res.data})
|
||
}
|
||
}
|
||
}
|
||
})
|
||
}
|
||
const clickPRD_MOViewIntoPro = (item:any) => {
|
||
PRD_MOViewIntoPro({
|
||
Number: item.FBillNo
|
||
}).then((res : any) => {
|
||
if(state.type === '2'){
|
||
toPages('/pages/putInProd/print',{...res.data})
|
||
}
|
||
})
|
||
}
|
||
const fnDataList = (scanData : boolean = false) => {
|
||
let param = {
|
||
queryString: state.queryString,
|
||
pageIndex: state.page.pageIndex,
|
||
pageSize: state.page.pageSize,
|
||
};
|
||
if (state.page.pageIndex == 1) {
|
||
uni.showLoading({ mask: true });
|
||
}
|
||
PRD_MOList(param).then(res => {
|
||
uni.hideLoading();
|
||
if (res.code == 200) {
|
||
let result = res.data;
|
||
let dataArray = result.list;
|
||
dataArray.forEach(p => {
|
||
p.FDateFormat = parseTime(p.FDate, '{y}-{m}-{d}');
|
||
});
|
||
|
||
if (state.page.pageIndex == 1) {
|
||
state.dataList = dataArray;
|
||
}
|
||
else {
|
||
state.dataList = state.dataList.concat(dataArray);
|
||
}
|
||
state.page.totalCount = result.total;
|
||
if (state.dataList.length == state.page.totalCount) { }
|
||
|
||
if (scanData && state.dataList.length === 1) {
|
||
if (state.dataList[0].FBillNo == state.queryString) {
|
||
viewIntoProFun(state.dataList[0])
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
const toPages = (url : string, data : any = {}) => {
|
||
uni.$u.route({
|
||
url: url,
|
||
params: data
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.app {
|
||
background-color: #F5F5F5;
|
||
|
||
.page {
|
||
padding: 18px 32rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: 100%;
|
||
flex: 1;
|
||
|
||
.input-box {
|
||
background-color: white;
|
||
box-sizing: border-box;
|
||
padding: 0 16rpx;
|
||
border-radius: 24rpx;
|
||
margin: 0 0 32rpx 0;
|
||
|
||
.u-textarea {
|
||
padding: 0 !important;
|
||
font-size: 24rpx !important;
|
||
color: #999999 !important;
|
||
}
|
||
|
||
.input-item {
|
||
box-sizing: border-box;
|
||
padding: 16rpx 0;
|
||
color: #222222;
|
||
font-size: 28rpx;
|
||
font-weight: 400;
|
||
|
||
.item-title {
|
||
//font-weight: 500;
|
||
font-size: 32rpx;
|
||
color: #333333;
|
||
}
|
||
|
||
.item-text {
|
||
font-weight: 400;
|
||
font-size: 27rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
}
|
||
|
||
.receive-listBox {
|
||
flex: 1;
|
||
|
||
.list-box-list {
|
||
width: 100%;
|
||
|
||
// margin: 20rpx auto;
|
||
.data-item {
|
||
border: 1px solid #efeaea;
|
||
border-radius: 20rpx;
|
||
box-shadow: 0rpx 15rpx 15rpx #efeaea;
|
||
padding: 20rpx 20rpx 0;
|
||
margin-bottom: 20rpx;
|
||
background-color: #ffffff;
|
||
|
||
.tit {
|
||
font-size: 30rpx;
|
||
font-weight: bold;
|
||
padding: 20rpx 0;
|
||
}
|
||
|
||
.line-p {
|
||
border: 1px solid #efeaea;
|
||
}
|
||
|
||
.b-font {
|
||
font-size: 25rpx;
|
||
padding: 20rpx 0;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |