488 lines
12 KiB
Vue
488 lines
12 KiB
Vue
<template>
|
||
<view class="container">
|
||
<VNavigationBar background-color="#fff" title="单据处理" title-color="#333"></VNavigationBar>
|
||
<!-- <view class="tabs">-->
|
||
<!-- <view v-for="(item, index) in tabs" :key="index" :class="{'active': item.value === active}" class="tab-item">-->
|
||
<!-- {{ item.name }}-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<view class="body-top">
|
||
<view class="body-top-search">
|
||
<input class="body-top-search-input" v-model="query" placeholder="配件名称"
|
||
placeholder-style="font-size: 28rpx"
|
||
type="text">
|
||
<text @click="handleSearch">搜索</text>
|
||
</view>
|
||
</view>
|
||
<view class="listBox">
|
||
<view class="list">
|
||
<view v-for="(item, index) in wares" :key="index" class="listItem">
|
||
<view class="repairName">
|
||
<radio @click="chooseItem(item)" v-if="isToBeReviewed" :checked="item.isSelected"/>
|
||
{{ item.waresName }}
|
||
</view>
|
||
<view class="repairBottom">
|
||
<text class="repairDesc">单位：
|
||
<text class="repairUnit">{{ item.wares.unit }}</text>
|
||
</text>
|
||
<text class="repairDesc">申请数量：
|
||
<text class="repairUnit">{{ item.waresCount }}</text>
|
||
</text>
|
||
<view class="repairBtns" v-if="isToBeReviewed">
|
||
<u-icon name="minus-circle-fill" size="24" @click="delNum(item)"></u-icon>
|
||
<text class="repairNum">{{ item.thisNum }}</text>
|
||
<u-icon color="#0174F6" name="plus-circle-fill" size="24" @click="addNum(item)"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="repairBottom">
|
||
<text class="repairDesc">库存：
|
||
<text class="repairUnit">{{ item.wares.stock }}</text>
|
||
</text>
|
||
<text class="repairDesc">已领取：
|
||
<text class="repairUnit">{{ item.waresAlreadyCount }}</text>
|
||
</text>
|
||
<view class="repairBtns"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="footer" v-if="isToBeReviewed">
|
||
<text class="label"></text>
|
||
<text class="repairNum"></text>
|
||
<view class="submit" @click="toPart">采购</view>
|
||
<view class="submit" @click="submitBefore">{{ isReceive ? '通知领料' : '通知退料' }}</view>
|
||
</view>
|
||
|
||
<uni-popup ref="popup" background-color="#fff">
|
||
<view class="popup-content" style="padding: 15px;">
|
||
<view class="dl-avatar-box">
|
||
<uni-file-picker :value="fileList" :sizeType="sizeType" @select="afterRead" @delete="deleteFile"
|
||
limit="9" title="请上传配件申请单照片（最多选择9张图片）"></uni-file-picker>
|
||
</view>
|
||
<button type="primary" @click="submit">保存</button>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import VNavigationBar from "@/components/VNavigationBar.vue";
|
||
import request from '@/utils/request';
|
||
import {
|
||
getJSONData, setJSONData
|
||
} from '@/utils/auth'
|
||
import {getDictTextByCodeAndValue, createUniqueCodeByHead} from "@/utils/utils";
|
||
import upload from "@/utils/upload";
|
||
import config from "@/config";
|
||
|
||
export default {
|
||
components: {VNavigationBar},
|
||
data() {
|
||
return {
|
||
//配件申请单id
|
||
twId: '',
|
||
//配件列表
|
||
wares: [],
|
||
//true 领料 ，false 退料
|
||
isReceive: true,
|
||
//父组件传入的数据
|
||
formData: {},
|
||
active: '',
|
||
isToBeReviewed: true,
|
||
query: null,
|
||
selectRows: [],
|
||
fileList: [],
|
||
sizeType: ['compressed'],
|
||
};
|
||
},
|
||
onLoad(data) {
|
||
if (getJSONData("applyWaresForm")) {
|
||
this.formData = getJSONData("applyWaresForm")
|
||
this.isReceive = this.formData.isReceive
|
||
this.twId = this.formData.id
|
||
this.init()
|
||
}
|
||
if (data.isToBeReviewed) {
|
||
this.isToBeReviewed = JSON.parse(data.isToBeReviewed)
|
||
}
|
||
},
|
||
|
||
computed: {},
|
||
methods: {
|
||
submitBefore(){
|
||
if (this.isReceive){
|
||
if (!this.selectRows || this.selectRows.length === 0){
|
||
uni.showToast({
|
||
title: '请选择配件！',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
this.$refs.popup.open()
|
||
}else {
|
||
this.submit()
|
||
}
|
||
},
|
||
afterRead(file) {
|
||
for (let i = 0; i < file.tempFilePaths.length; i++) {
|
||
upload({
|
||
url: '/admin-api/infra/file/upload',
|
||
filePath: file.tempFilePaths[i]
|
||
}).then((res) => {
|
||
this.fileList.push({
|
||
url: config.baseImageUrl + res.data
|
||
})
|
||
console.log(this.fileList)
|
||
})
|
||
}
|
||
},
|
||
deleteFile(file, index) {
|
||
this.fileList.splice(index, 1);
|
||
},
|
||
chooseItem(item) {
|
||
const index = this.selectRows.findIndex(i => i.id === item.id)
|
||
const parentIndex = this.wares.findIndex(i => i.id === item.id)
|
||
if (index === -1) {
|
||
this.$set(item, 'isSelected', true)
|
||
this.selectRows.push(item)
|
||
} else {
|
||
this.$set(item, 'isSelected', false)
|
||
this.selectRows.splice(index, 1)
|
||
}
|
||
if (parentIndex !== -1) {
|
||
this.$set(this.wares, parentIndex, item)
|
||
}
|
||
},
|
||
handleSearch() {
|
||
this.init()
|
||
},
|
||
/**
|
||
* 初始化配件数据
|
||
*/
|
||
init() {
|
||
const params = {
|
||
twId: this.formData.id,
|
||
query: this.query
|
||
}
|
||
request({
|
||
url: '/admin-api/repair/twi/list',
|
||
method: 'get',
|
||
params: params
|
||
}).then((res) => {
|
||
this.wares = res.data
|
||
if (this.isToBeReviewed) {
|
||
this.wares = this.wares.filter(item => item.waresStatus === '1')
|
||
this.wares = this.wares.filter(item => this.isReceive ? (item.waresCount > item.waresAlreadyCount) : (item.waresAlreadyCount > 0))
|
||
}
|
||
this.wares.forEach(item => {
|
||
if (!item.wares.stock) {
|
||
item.wares.stock = 0
|
||
}
|
||
if (this.isReceive) {
|
||
//领料，最大可领取数量为申请数量-已领取数量，同时不能大于库存数量，默认数量就是最大可领取数量
|
||
item.maxNum = parseInt(item.waresCount) - parseInt(item.waresAlreadyCount)
|
||
if (item.maxNum > item.wares.stock) {
|
||
item.maxNum = item.wares.stock
|
||
}
|
||
item.thisNum = item.maxNum
|
||
} else {
|
||
//退料，最大数量为已领取数量，最小数量为0,默认数量为0
|
||
item.maxNum = item.waresAlreadyCount
|
||
item.thisNum = 0
|
||
}
|
||
if (!this.selectRows || this.selectRows.length === 0){
|
||
item.isSelected = false
|
||
}else {
|
||
item.isSelected = this.selectRows.findIndex(i => i.id === item.id) !== -1
|
||
}
|
||
})
|
||
})
|
||
},
|
||
/**
|
||
*
|
||
*/
|
||
addNum(repair) {
|
||
if ((repair.thisNum + 1) > repair.maxNum) {
|
||
uni.showToast({
|
||
title: '超过库存数量或最大申请数量！',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
this.$set(repair, 'thisNum', repair.thisNum + 1)
|
||
const findIndex = this.wares.findIndex(f => f.id === repair.id);
|
||
if (findIndex !== -1) {
|
||
this.$set(this.wares, findIndex, repair);
|
||
}
|
||
// const find = this.wares.find(f => f.id == repair.id)
|
||
// if (find) {
|
||
// find.thisNum = repair.thisNum
|
||
// } else {
|
||
// this.wares.push(JSON.parse(JSON.stringify(repair)))
|
||
// }
|
||
},
|
||
/**
|
||
* 减
|
||
*/
|
||
delNum(repair) {
|
||
if (repair.thisNum == 0) {
|
||
//已经等于0了，没法再减了
|
||
return
|
||
}
|
||
this.$set(repair, 'thisNum', repair.thisNum - 1)
|
||
const findIndex = this.wares.findIndex(f => f.id === repair.id);
|
||
if (findIndex !== -1) {
|
||
this.$set(this.wares, findIndex, repair);
|
||
}
|
||
// const find = this.wares.find(f => f.id == repair.id)
|
||
// if (find) {
|
||
// find.thisNum = repair.thisNum
|
||
// } else {
|
||
// this.wares.push(JSON.parse(JSON.stringify(repair)))
|
||
// }
|
||
},
|
||
/**
|
||
* 出库
|
||
*/
|
||
submit() {
|
||
this.formData.repairSo = {
|
||
soType: this.isReceive ? '02' : '04',
|
||
soNo: createUniqueCodeByHead(this.isReceive ? 'LL' : 'TL'),
|
||
userId: this.formData.repairId,
|
||
userName: this.formData.repairName,
|
||
soStatus: this.isReceive ? '04' : '07'
|
||
}
|
||
if (!this.selectRows || this.selectRows.length === 0){
|
||
uni.showToast({
|
||
title: '请选择配件！',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
// 过滤一下，thisNum不等0才行
|
||
const flag = this.selectRows.filter(item => item.thisNum > 0)
|
||
if (!flag || flag.length === 0) {
|
||
uni.showToast({
|
||
title: '请设置配件数量！',
|
||
icon: 'none'
|
||
})
|
||
return
|
||
}
|
||
// this.wares = flag
|
||
this.formData.repairSois = [...flag.map(item => {
|
||
return {
|
||
soiType: this.isReceive ? '02' : "04",
|
||
goodsId: item.waresId,
|
||
goodsCount: item.thisNum,
|
||
}
|
||
})]
|
||
if (this.isReceive) {
|
||
this.formData.items = [...flag.map(item => {
|
||
return {
|
||
id: item.id,
|
||
}
|
||
})]
|
||
}
|
||
if (this.isReceive && this.fileList && this.fileList.length > 0){
|
||
this.formData.images = this.fileList.map(item => {
|
||
return item.path.replace(config.baseImageUrl, "")
|
||
}).join(",")
|
||
}
|
||
request({
|
||
url: '/admin-api/repair/tw/pass',
|
||
method: 'post',
|
||
data: this.formData
|
||
}).then((res) => {
|
||
if (this.isReceive){
|
||
this.$refs.popup.close()
|
||
}
|
||
if (res.code === 200) {
|
||
uni.showToast({
|
||
title: '通知成功！',
|
||
icon: 'none'
|
||
})
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 700)
|
||
}
|
||
})
|
||
},
|
||
|
||
/**
|
||
* 跳转采购页面
|
||
*/
|
||
toPart() {
|
||
const formData = this.formData;
|
||
if (this.selectRows && this.selectRows.length > 0) {
|
||
formData.items = this.selectRows
|
||
} else {
|
||
formData.items = this.wares;
|
||
}
|
||
setJSONData("applyWaresForm", formData)
|
||
uni.navigateTo({
|
||
url: '/pages-warehouse/inOutWarehouse/part'
|
||
})
|
||
}
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.container {
|
||
height: 100%;
|
||
background-color: #F3F5F7;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.search {
|
||
padding: 0 40rpx;
|
||
background-color: #fff;
|
||
|
||
& > .searchBox {
|
||
height: 84rpx;
|
||
background: #F3F5F7;
|
||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||
margin: 0 auto;
|
||
padding: 0 30rpx;
|
||
font-size: 28rpx;
|
||
color: #0174F6;
|
||
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.searchInput {
|
||
flex: 1;
|
||
width: 0;
|
||
color: #333;
|
||
}
|
||
}
|
||
|
||
.tabs {
|
||
background-color: #fff;
|
||
padding: 30rpx 40rpx;
|
||
margin: 0 auto;
|
||
display: flex;
|
||
align-items: center;
|
||
column-gap: 30rpx;
|
||
overflow: auto;
|
||
|
||
.tab-item {
|
||
flex-shrink: 0;
|
||
padding: 16rpx 30rpx;
|
||
font-size: 28rpx;
|
||
color: #113A68;
|
||
background: #F2F2F7;
|
||
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
||
|
||
&.active {
|
||
background: #0174F6;
|
||
color: #fff;
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.listBox {
|
||
padding: 30rpx 32rpx;
|
||
flex: 1;
|
||
height: 0;
|
||
|
||
.list {
|
||
background-color: #fff;
|
||
padding: 0 30rpx;
|
||
height: 100%;
|
||
overflow: auto;
|
||
}
|
||
|
||
.listItem {
|
||
padding: 30rpx 0;
|
||
border-bottom: 2rpx solid #DDDDDD;
|
||
|
||
&:last-child {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.repairName {
|
||
font-size: 32rpx;
|
||
color: #333333;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.repairBottom {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.repairDesc {
|
||
font-size: 28rpx;
|
||
color: #858BA0;
|
||
}
|
||
|
||
.repairUnit {
|
||
color: #333333;
|
||
}
|
||
|
||
.repairBtns {
|
||
width: 65px;
|
||
display: flex;
|
||
align-items: center;
|
||
column-gap: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.footer {
|
||
padding: 14rpx 32rpx;
|
||
background-color: #fff;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.repairNum {
|
||
flex: 1;
|
||
width: 0;
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
.submit {
|
||
width: 208rpx;
|
||
height: 72rpx;
|
||
background: #0174F6;
|
||
border-radius: 38rpx 38rpx 38rpx 38rpx;
|
||
text-align: center;
|
||
line-height: 72rpx;
|
||
font-size: 32rpx;
|
||
color: #FFFFFF;
|
||
margin-left: 20rpx;
|
||
}
|
||
}
|
||
|
||
.body-top {
|
||
//width: 686rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
margin: 30rpx 30rpx 0;
|
||
|
||
.body-top-search {
|
||
height: 84rpx;
|
||
background: #F3F5F7;
|
||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||
margin: 0 auto;
|
||
padding: 0 30rpx;
|
||
font-size: 28rpx;
|
||
|
||
display: flex;
|
||
align-items: center;
|
||
column-gap: 10rpx;
|
||
|
||
.body-top-search-input {
|
||
flex: 1;
|
||
width: 0;
|
||
}
|
||
}
|
||
}
|
||
</style>
|