<template>
|
<view>
|
<page-nav title="生产报工"></page-nav>
|
|
|
<view class="flex_center" style="margin: 20rpx;">
|
|
<!-- #ifdef H5 -->
|
<u--input prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399" :placeholder="placeholder"
|
style="width:100%;background-color: #fff;border-radius: 40rpx;" border="surround" suffixIcon="scan"
|
suffixIconStyle="color: #909399;font-size: 22px;" v-model="inputBoxValue"
|
@change="confirmInputBoxValue">
|
<template slot="suffix">
|
<u-icon name="scan" color="#909399" size="24" @click="scanClick"></u-icon>
|
</template>
|
</u--input>
|
<!-- #endif -->
|
|
<!-- #ifdef APP-PLUS -->
|
<u-input prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399" :placeholder="placeholder"
|
style="width:100%;background-color: #fff;border-radius: 40rpx;" border="surround" suffixIcon="scan"
|
suffixIconStyle="color: #909399;font-size: 22px;" v-model="inputBoxValue"
|
@change="confirmInputBoxValue">
|
<template slot="suffix">
|
<u-icon name="scan" color="#909399" size="24" @click="scanClick"></u-icon>
|
</template>
|
</u-input>
|
<!-- #endif -->
|
|
<view class="flex_center marginLeft20" @click="popupShow=true">
|
<u--text size='16' color='#909399' text="筛选"></u--text>
|
<u--image :showLoading="true" src="../../static/img/sift.png" width="20px" height="20px"></u--image>
|
</view>
|
</view>
|
|
|
<u-alert :title="'工单数量（'+total+'）'" type="info"></u-alert>
|
|
|
<!-- 折叠面板 -->
|
<!-- <u-collapse @change="change" @close="close" @open="open"> -->
|
<!-- @change="collapseChange" -->
|
|
|
<u-collapse style="max-height: 62vh;overflow: auto;">
|
<!-- :value='parseFloat(item.ordergoodqty)+"/"+parseFloat(item.orderqty)' -->
|
<scroll-view scroll-y :style="{height: 590 + 'px'}" @scrolltolower="loadMore">
|
<u-collapse-item style="position: relative;" :title="item.ordercode" :name='item.ordercode'
|
v-if='item.children.length!==0'
|
:value='parseFloat(item.ordergoodqty)+parseFloat(item.orderngqty)+parseFloat(item.orderlaborbadqty)+parseFloat(item.ordermaterielbadqty)+"/"+parseFloat(item.orderqty)'
|
:label="item.children.length===0?'未派发':''" :disabled='item.children.length===0'
|
v-for="(item,index) in collapseArr" :key="item.ordercode+index">
|
|
|
<view style="position: absolute;left: 30rpx;top:34px;font-size: 24rpx;color: #999;">
|
{{item.partname}} {{item.partspec}}
|
</view>
|
|
<!-- <view style="position: absolute;width: 26%;left: 44%;top:16px;"> -->
|
<view style="position: absolute;width: 120px;left: 44%;top:16px;color:#0659ff">
|
<!-- @click="progressClick(item.ordercode)" -->
|
<!-- {{item.partname}}{{item.partspec}} -->
|
<u-line-progress
|
:percentage="parseFloat(((parseFloat(item.ordergoodqty)+parseFloat(item.orderngqty)+parseFloat(item.orderlaborbadqty)+parseFloat(item.ordermaterielbadqty))*100/item.orderqty).toFixed(2))"
|
inactiveColor="#d1d6f5" height="10" activeColor="#0659ff"></u-line-progress>
|
</view>
|
|
<!-- <view style="position: absolute;width: 100px;right: 33px; top:13px; ">
|
<view class="" style="display: flex;justify-content: flex-end;">
|
<view style="color: #0659ff;">
|
{{parseFloat(item.ordergoodqty)}}
|
</view>
|
<view>
|
/{{ parseFloat(item.orderqty)}}
|
</view>
|
</view>
|
</view>
|
-->
|
|
|
<view v-if="radiovalue==='生产工单'" style="margin:0 0 5px">
|
<view class="flex_column">
|
<view style="display:flex">
|
<view class="titleFont" style="font-size: 14px;">产品编码：</view>
|
<view class="contentFont" style="font-size: 14px;">{{item.partcode}}</view>
|
</view>
|
<view style="display:flex">
|
<view class="titleFont" style="font-size: 14px;">产品名称：</view>
|
<view class="contentFont" style="font-size: 14px;">{{item.partname}}</view>
|
</view>
|
<view style="display:flex">
|
<view class="titleFont" style="font-size: 14px;">产品规格：</view>
|
<view class="contentFont" style="font-size: 14px;">{{item.partspec?item.partspec:'/'}}
|
</view>
|
</view>
|
</view>
|
</view>
|
|
|
<!-- {{item.children}} -->
|
<!-- <u--text class="u-collapse-content"> -->
|
<u-steps :current="-1" inactiveColor='#0659FF' direction="column">
|
<view v-for="(it,ind) in item.children" :key="item.ordercode+it.name+ind"
|
@click="gotoPage(item.ordercode,it.code,it)" style="display: flex;align-items: center;">
|
|
<!-- <u-steps-item :title="it.code+'/'+it.name+it.spec"></u-steps-item> -->
|
<u-steps-item :title="it.code+'/'+it.name"></u-steps-item>
|
<view class="" style="width: 100px;">
|
<u-line-progress
|
:percentage="parseFloat(((parseFloat(it.goodqty)+parseFloat(it.ngqty)+parseFloat(it.laborbadqty)+parseFloat(it.materielbadqty))*100/it.planqty).toFixed(2))"
|
inactiveColor="#d1d6f5" height="10" activeColor="#0659ff"></u-line-progress>
|
</view>
|
<view style="width: 30%;text-align: right;">
|
<view class="" style="display: flex;justify-content: flex-end;">
|
<view style="color: #0659ff;">
|
{{parseFloat(it.goodqty)}}
|
</view>
|
<view style="color: #ff0000;">
|
+{{parseFloat(it.ngqty)+parseFloat(it.laborbadqty)+parseFloat(it.materielbadqty)}}
|
</view>
|
<view>
|
/{{ parseFloat(it.planqty)}}
|
</view>
|
</view>
|
</view>
|
</view>
|
|
</u-steps>
|
<!-- </u--text> -->
|
|
|
</u-collapse-item>
|
</scroll-view>
|
</u-collapse>
|
|
|
|
|
<view class="uni-pagination-box">
|
<uni-pagination show-icon :page-size="pageSize" :current="currentpage" :total="total"
|
@change="pageChange" />
|
</view>
|
|
|
<!-- 弹出层 -->
|
<!-- closeIconPos='top-left' closeOnClickOverlay closeable='true' -->
|
<u-popup :show="popupShow" mode="right" @close="popupClose" @open="popupOpen">
|
<view style="margin: 120px 10px 20px;" class="flex_column">
|
|
<view style="display: flex;">
|
<view>
|
单据类型：
|
</view>
|
|
<u-radio-group v-model="radiovalue" placement="column" @change="groupChange"
|
style="margin-top: 4px;">
|
<u-radio :customStyle="{marginBottom: '8px'}" v-for="(item, index) in radiolist"
|
:key="index+item.name" :label="item.name" iconSize='16' labelSize='16' :name="item.name">
|
|
</u-radio>
|
</u-radio-group>
|
</view>
|
|
<u--input :placeholder="'请输入'+placeholder2" style="border: 1rpx solid #eee;" :clearable='true'
|
v-model="order"></u--input>
|
|
|
<view style="margin-top: 20px;display: flex;align-items: center;">
|
|
<view class="">
|
产品信息：
|
</view>
|
<view class="">
|
<u-button :hairline="true" shape="circle" icon="map" :plain="true"
|
style="width: 100px;height: 26px;" type="primary" text="选择产品" @click="chosePart"></u-button>
|
</view>
|
|
</view>
|
|
|
<view style="display: flex;flex-wrap: wrap;">
|
<u-tag style="width:220rpx;" :text="item.name" v-for="item in tagArr" :key="item.code"
|
:closable="true" :show="item.close" @close="tagClose(item)"></u-tag>
|
</view>
|
|
|
|
<!-- <view class="head" style="margin-top: 10px;">
|
<view class="head_block" style="height: 80rpx; display: flex;justify-content: space-around;">
|
<u-button :plain='today' style="width: 70px;height: 25px;" @click="dateChange('today')"
|
type="primary" shape="circle" text="今日">
|
</u-button>
|
<u-button :plain='month' style="width: 70px;height: 25px;" @click="dateChange('month')"
|
type="primary" shape="circle" text="本月">
|
</u-button>
|
<u-button :plain='custom' style="width: 70px;height: 25px;" @click="dateChange('custom')"
|
type="primary" shape="circle" text="自定义"></u-button>
|
</view>
|
</view> -->
|
|
<!-- <view v-if="!custom" class="flex_column"
|
style="display: flex;justify-content: space-around;width: 100%;">
|
<view class="" style="display: flex;justify-content: space-evenly;width: 100%;">
|
<view class="titleFont">开始日期</view>
|
<view class="titleFont">~</view>
|
<view class="titleFont">结束日期</view>
|
</view>
|
|
<u-button type="info" icon='calendar' iconColor="#0659FF" size="" @click="calendarClick"
|
:text="calendarRange">
|
</u-button>
|
</view>
|
|
<uni-calendar ref="calendar" :range='true' :insert="false" @confirm="calendarConfirm" /> -->
|
|
</view>
|
</u-popup>
|
|
|
<!-- <scan-code></scan-code> -->
|
|
|
<!-- 悬浮球 -->
|
<!-- <view @click="scan2">
|
<drag-ball :x='300' :y="600"></drag-ball>
|
</view> -->
|
|
|
<scan-code></scan-code>
|
|
</view>
|
</template>
|
|
|
<script>
|
import {
|
ProductOrderSearch
|
} from '../../config/api.js';
|
import scanCode from '@/components/scan-code/scan-code.vue'
|
|
export default {
|
components: {
|
scanCode
|
},
|
onLoad(option) {
|
const _this = this
|
uni.$off('scancodedate') // 每次进来先 移除全局自定义事件监听器
|
uni.$on('scancodedate', function(content) {
|
console.log("扫描到的内容为:", content)
|
_this.getCheckScanDeviceQrCodeData(content)
|
})
|
},
|
|
onPullDownRefresh() {
|
setTimeout(() => {
|
this.init(() => {
|
uni.stopPullDownRefresh();
|
})
|
}, 1000);
|
},
|
|
data() {
|
return {
|
topRightMessageCount: '',
|
inputBoxValue: '',
|
alertTitle: '',
|
popupShow: false, //弹出层是否显示
|
collapseArr: [ //折叠面板数据
|
],
|
collapseArrAll: [], //所有
|
placeholder: '请输入工单信息',
|
radiovalue: '生产工单', //单据类型
|
// SO：销售订单 MO：生产订单 PO：生产工单
|
radiolist: [{
|
name: '销售订单'
|
},
|
{
|
name: '生产订单'
|
},
|
{
|
name: '生产工单'
|
},
|
],
|
|
today: true,
|
month: false,
|
custom: true,
|
|
// calendarRange: new Date().toISOString().slice(0, 10) + '~' + new Date().toISOString().slice(0,
|
// 10), //系统当前日期
|
calendarRange: new Date().getFullYear() + '-' + (new Date().getMonth() + 1).toString().padStart(
|
2, '0') + '-01' + '~' + new Date().toISOString().slice(0, 10), //当月日期
|
|
|
|
tagArr: [
|
// {
|
// close: true,
|
// name: '电池包',
|
// code: '1002'
|
// }, {
|
// close: true,
|
// name: '电脑',
|
// code: '1003'
|
// }, {
|
// close: true,
|
// name: '8054光机',
|
// code: '1004'
|
// }, {
|
// close: true,
|
// name: 'G71674冲锋枪',
|
// code: '1005'
|
// }, {
|
// close: true,
|
// name: '8051光机',
|
// code: '1006'
|
// },
|
], //已选中的产品标签
|
order: '', //单号
|
placeholder2: '生产订单',
|
total: 0,
|
currentpage: 1, //第几页
|
pageSize: 10, //每页显示多少条
|
|
}
|
},
|
// 监听下拉刷新动作（UniApp 原生生命周期）
|
onPullDownRefresh() {
|
let that = this
|
uni.startPullDownRefresh({
|
success() {
|
that.getProductOrderSearch(that.currentpage)
|
uni.showToast({
|
title: "下拉刷新",
|
icon: 'none'
|
})
|
},
|
complete() {
|
uni.stopPullDownRefresh()
|
}
|
})
|
},
|
created() {
|
|
},
|
mounted() {
|
this.init()
|
|
this.getProductOrderSearch(1)
|
},
|
methods: {
|
init() {
|
uni.stopPullDownRefresh();
|
},
|
gotoPage(p1, p2, it) {
|
|
if (parseFloat(it.goodqty) + parseFloat(it.ngqty) + parseFloat(it.laborbadqty) + parseFloat(it
|
.materielbadqty) === parseFloat(it.planqty)) {
|
return uni.$u.toast('当前工序无可报数量！')
|
}
|
|
let orderstep = null
|
|
if (p1) {
|
orderstep = p1 + ';' + p2
|
} else {
|
orderstep = ''
|
}
|
|
|
uni.navigateTo({
|
url: './scbg2?orderstep=' + orderstep + '¤tpage=' + this.currentpage
|
})
|
},
|
|
getCheckboxValue(val) {
|
this.tagArr = []
|
val.forEach(i => {
|
this.tagArr.push({
|
close: true,
|
name: i.split('/')[1].trim(),
|
code: i.split('/')[0].trim()
|
})
|
})
|
},
|
|
// 页数改变时 分页触发
|
pageChange(e) {
|
this.currentpage = e.current
|
this.getProductOrderSearch(e.current)
|
},
|
|
// 接口获取
|
async getProductOrderSearch(current) {
|
let ordertype = '' // SO：销售订单 MO：生产订单 PO：生产工单
|
switch (this.radiovalue) {
|
case '生产工单':
|
// this.alertTitle = '工单数量（共/个）'
|
// this.placeholder = '请输入工单信息'
|
ordertype = 'PO'
|
break
|
case '生产订单':
|
// this.alertTitle = '生产订单数量（共/个）'
|
// this.alertTitle = '工单数量（共/个）'
|
// this.placeholder = '请输入生产订单信息'
|
ordertype = 'MO'
|
break
|
case '销售订单':
|
// this.alertTitle = '销售订单数量（共/个）'
|
// this.alertTitle = '工单数量（共/个）'
|
// this.placeholder = '请输入销售订单信息'
|
ordertype = 'SO'
|
break
|
}
|
|
|
const data = {
|
ordertype,
|
partcode: this.tagArr.map(i => i.code).join(','),
|
ordercode: this.order,
|
Ratetime: '',
|
// Ratetime: this.calendarRange,
|
|
page: current,
|
rows: this.pageSize,
|
prop: 'lm_date',
|
sortorder: 'desc'
|
|
}
|
const res = await ProductOrderSearch(data)
|
|
this.total = res.count
|
|
this.collapseArr = res.data
|
this.collapseArrAll = res.data
|
// this.alertTitle = this.alertTitle.split('/')[0] + this.total + this.alertTitle.split('/')[
|
// 1]
|
|
},
|
loadMore() {
|
|
},
|
|
//输入框回车确认事件
|
confirmInputBoxValue(val) {
|
this.order = val
|
this.currentpage = 1
|
this.getProductOrderSearch(1)
|
// this.collapseArr = this.collapseArrAll.filter((p) => {
|
// return p.ordercode.indexOf(val) !== -1
|
// })
|
|
|
// switch (this.radiovalue) {
|
// case '生产工单':
|
// this.alertTitle = '工单数量（共' + this.total + '个）'
|
// break
|
// case '生产订单':
|
// this.alertTitle = '工单数量（共' + this.total + '个）'
|
// break
|
// case '销售订单':
|
// this.alertTitle = '工单数量（共' + this.total + '个）'
|
// break
|
// }
|
|
|
|
// this.alertTitle = this.alertTitle.split('/')[0] + this.collapseArr.length + this.alertTitle.split('/')[
|
// 1]
|
|
},
|
|
// 点击扫码
|
scanClick() {
|
this.topScanClick()
|
},
|
|
// 扫码框点击
|
topScanClick() {
|
let that = this;
|
|
uni.scanCode({
|
onlyFromCamera: true,
|
// scanType: ['barCode', 'qrCode'],
|
scanType: ['qrCode'],
|
success: function(res) {
|
console.log('条码类型：' + res.scanType);
|
console.log('条码内容：' + res.result);
|
that.scanContent = res.result;
|
|
that.getCheckScanDeviceQrCodeData(that.scanContent);
|
},
|
complete: function(res) {
|
|
},
|
fail: function(res) {
|
console.log('条码类型：' + res.scanType);
|
console.log('条码内容：' + res.result);
|
}
|
|
});
|
},
|
|
scan2() {
|
let that = this;
|
|
uni.scanCode({
|
onlyFromCamera: true,
|
// scanType: ['barCode', 'qrCode'],
|
scanType: ['qrCode'],
|
success: function(res) {
|
console.log('条码类型：' + res.scanType);
|
console.log('条码内容：' + res.result);
|
// that.scanContent = res.result;
|
|
uni.navigateTo({
|
url: './scbg2?orderstep=' + res.result
|
})
|
|
},
|
complete: function(res) {
|
|
},
|
fail: function(res) {
|
console.log('条码类型：' + res.scanType);
|
console.log('条码内容：' + res.result);
|
}
|
|
});
|
},
|
|
getCheckScanDeviceQrCodeData(code) {
|
this.inputBoxValue = code
|
this.confirmInputBoxValue(this.inputBoxValue)
|
},
|
|
|
// 弹出层收起
|
popupClose() {
|
this.getProductOrderSearch(1)
|
this.popupShow = false
|
},
|
|
// 弹出层弹出
|
popupOpen() {
|
|
},
|
|
// 选择产品
|
chosePart() {
|
let arr = []
|
this.tagArr.forEach(i => {
|
arr.push(i.code + '/' + i.name)
|
})
|
uni.navigateTo({
|
url: '../znfx/chda?param=' + JSON.stringify(arr)
|
});
|
},
|
|
// tag标签关闭
|
tagClose(val) {
|
this.tagArr.forEach((i, j) => {
|
if (i.code === val.code) {
|
i.close = false
|
this.tagArr.splice(j, 1)
|
}
|
})
|
},
|
|
// 时间范围切换
|
dateChange(val) {
|
if (val === 'today') {
|
this.today = false
|
this.month = true
|
this.custom = true
|
this.calendarRange = new Date().toISOString().slice(0, 10) + '~' + new Date().toISOString().slice(0,
|
10)
|
} else if (val === 'month') {
|
this.today = true
|
this.month = false
|
this.custom = true
|
|
this.calendarRange = new Date().getFullYear() + '-' + (new Date().getMonth() + 1).toString().padStart(
|
2, '0') + '-01' + '~' + new Date().toISOString().slice(0, 10)
|
|
} else if (val === 'custom') {
|
this.today = true
|
this.month = true
|
this.custom = false
|
this.calendarRange = new Date().getFullYear() + '-' + (new Date().getMonth() + 1).toString().padStart(
|
2, '0') + '-01' + '~' + new Date().toISOString().slice(0, 10)
|
}
|
},
|
|
// 日历时间点击
|
calendarClick() {
|
this.$refs.calendar.open();
|
},
|
|
// 日历确定事件点击
|
calendarConfirm(val) {
|
if (val.range.before < val.range.after) {
|
this.calendarRange = val.range.before + '~' + val.range.after
|
} else {
|
this.calendarRange = val.range.after + '~' + val.range.before
|
}
|
|
if (val.range.before === '') {
|
this.calendarRange = new Date().toISOString().slice(0, 10) + '~' + val.range.after
|
}
|
if (val.range.after === '') {
|
this.calendarRange = val.range.before + '~' + new Date().toISOString().slice(0, 10)
|
}
|
if (val.range.before === '' && val.range.after === '') {
|
this.calendarRange = new Date().toISOString().slice(0, 10) + '~' + new Date().toISOString().slice(0,
|
10)
|
}
|
// this.getData()
|
},
|
|
|
// 单选按钮切换
|
groupChange(val) {
|
console.log(val)
|
this.placeholder2 = val
|
},
|
|
|
|
|
|
|
|
|
|
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import url('@/style/global.css');
|
|
::v-deep .uicon-arrow-left>span {
|
display: block;
|
}
|
|
::v-deep .u-alert__text--info--light {
|
margin-bottom: 0;
|
font-size: 32rpx !important;
|
padding-left: 10rpx;
|
color: #212121 !important;
|
font-weight: lighter;
|
}
|
|
::v-deep .u-alert--info--light {
|
background-color: rgba(255, 255, 255, 0.7);
|
}
|
|
::v-deep .u-steps-item__wrapper {
|
background-color: #eee;
|
}
|
|
::v-deep .u-steps-item__line--column {
|
display: none;
|
}
|
|
::v-deep .u-slide-right-enter-active {
|
width: 70%;
|
}
|
|
::v-deep .uicon-calendar {
|
font-size: 36rpx !important;
|
}
|
|
::v-deep .u-cell__title-text {
|
font-size: 28rpx;
|
color: #212121;
|
}
|
|
::v-deep .u-cell__value {
|
font-size: 28rpx;
|
// color: transparent;
|
color: #212121;
|
|
}
|
|
::v-deep .u-cell__label {
|
margin-top: 0;
|
line-height: 12px;
|
}
|
|
::v-deep .uicon-arrow-right {
|
font-size: 14px !important;
|
color: #212121 !important;
|
}
|
|
::v-deep .u-line-progress__text {
|
// margin-right: -20px;
|
// color: #212121;
|
// width: 100px;
|
// margin-top: 10px;
|
display: none;
|
|
}
|
|
::v-deep .u-text__value--content {
|
font-size: 12px !important;
|
}
|
|
::v-deep .u-tag__close {
|
background: #436df5 !important;
|
}
|
|
::v-deep .u-cell__body {
|
padding-bottom: 40rpx;
|
}
|
|
.uni-pagination-box {
|
height: 4vh;
|
margin: 1vh 0;
|
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
// background-color: #fff;
|
}
|
</style>
|
