259 lines
8.2 KiB
Vue
259 lines
8.2 KiB
Vue
|
<template>
|
|||
|
|
<!-- 领料出库详情 -->
|
|||
|
|
<view class="page-container">
|
|||
|
|
<uni-row :gutter="24" class="search-form">
|
|||
|
|
<uni-col :span="12">
|
|||
|
|
<view>
|
|||
|
|
<uni-easyinput placeholder="请输入内容" />
|
|||
|
|
</view>
|
|||
|
|
</uni-col>
|
|||
|
|
<uni-col :span="4">
|
|||
|
|
<view class="search">查询</view>
|
|||
|
|
</uni-col>
|
|||
|
|
<uni-col :span="4">
|
|||
|
|
<view class="search" style="background-color: #19be6b">合格</view>
|
|||
|
|
</uni-col>
|
|||
|
|
</uni-row>
|
|||
|
|
|
|||
|
|
<view class="table-list-item">
|
|||
|
|
<checkbox-group @change="onChangeAllChecked">
|
|||
|
|
<label>
|
|||
|
|
全选
|
|||
|
|
<checkbox
|
|||
|
|
color="#409eff"
|
|||
|
|
borderColor="#409eff"
|
|||
|
|
activeBorderColor="#409eff"
|
|||
|
|
:checked="allChecked"
|
|||
|
|
value="all"
|
|||
|
|
style="transform: scale(0.7)"
|
|||
|
|
/>
|
|||
|
|
</label>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<scroll-view scroll-y class="scroll-container">
|
|||
|
|
<view
|
|||
|
|
v-for="(item, index) in detailsList"
|
|||
|
|
:key="index"
|
|||
|
|
class="table-list-item"
|
|||
|
|
@tap="onCodingItem(item)"
|
|||
|
|
>
|
|||
|
|
<view class="line"></view>
|
|||
|
|
<uni-row :gutter="24">
|
|||
|
|
<uni-col :span="2">
|
|||
|
|
<checkbox-group @change="onChangeChecked(item.isChecked)">
|
|||
|
|
<label>
|
|||
|
|
<checkbox
|
|||
|
|
color="#409eff"
|
|||
|
|
borderColor="#409eff"
|
|||
|
|
activeBorderColor="#409eff"
|
|||
|
|
:checked="item.isChecked"
|
|||
|
|
value="all"
|
|||
|
|
style="transform: scale(0.7)"
|
|||
|
|
/>
|
|||
|
|
</label>
|
|||
|
|
</checkbox-group>
|
|||
|
|
</uni-col>
|
|||
|
|
<uni-col :span="6">物资名称：</uni-col>
|
|||
|
|
<uni-col :span="16">
|
|||
|
|
<view class="cont">{{ item.typeName }}</view>
|
|||
|
|
</uni-col>
|
|||
|
|
</uni-row>
|
|||
|
|
<uni-row :gutter="24">
|
|||
|
|
<uni-col :span="2" style="color: transparent">{{ index + 1 }}</uni-col>
|
|||
|
|
<uni-col :span="6">规格型号：</uni-col>
|
|||
|
|
<uni-col :span="16">
|
|||
|
|
<view class="cont">{{ item.type }}</view>
|
|||
|
|
</uni-col>
|
|||
|
|
</uni-row>
|
|||
|
|
<uni-row :gutter="24">
|
|||
|
|
<uni-col :span="2" style="color: transparent">{{ index + 1 }}</uni-col>
|
|||
|
|
<uni-col :span="6">已退数量：</uni-col>
|
|||
|
|
<uni-col :span="16">
|
|||
|
|
<view class="cont">{{ item.repairNum }}</view>
|
|||
|
|
</uni-col>
|
|||
|
|
</uni-row>
|
|||
|
|
<uni-row :gutter="24">
|
|||
|
|
<uni-col :span="2" style="color: transparent">{{ index + 1 }}</uni-col>
|
|||
|
|
<uni-col :span="6">单位：</uni-col>
|
|||
|
|
<uni-col :span="16">
|
|||
|
|
<view class="cont">{{ item.unitName }}</view>
|
|||
|
|
</uni-col>
|
|||
|
|
</uni-row>
|
|||
|
|
<uni-row :gutter="24">
|
|||
|
|
<uni-col :span="2" style="color: transparent">{{ index + 1 }}</uni-col>
|
|||
|
|
<uni-col :span="6">管理模式：</uni-col>
|
|||
|
|
<uni-col :span="16">
|
|||
|
|
<uni-tag
|
|||
|
|
text="编码"
|
|||
|
|
type="warning"
|
|||
|
|
v-if="item.manageType === 0"
|
|||
|
|
size="small"
|
|||
|
|
/>
|
|||
|
|
<uni-tag
|
|||
|
|
text="数量"
|
|||
|
|
type="success"
|
|||
|
|
v-if="item.manageType === 1"
|
|||
|
|
size="small"
|
|||
|
|
/>
|
|||
|
|
</uni-col>
|
|||
|
|
</uni-row>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup>
|
|||
|
|
import { ref, onUnmounted } from 'vue'
|
|||
|
|
import { getRepairDetailsAPI } from '@/services/repair/repair.js'
|
|||
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|||
|
|
const detailsList = ref([])
|
|||
|
|
const query = defineProps() // 获取上级页面传递的路由参数
|
|||
|
|
const allChecked = ref(false)
|
|||
|
|
|
|||
|
|
// 领料单位，参数等信息
|
|||
|
|
const leaseApplyInfo = ref({
|
|||
|
|
leaseUnit: '', // 领料单位
|
|||
|
|
leaseProject: '', // 领料工程
|
|||
|
|
maTypeName: '', // 物资类型
|
|||
|
|
typeName: '', // 规格型号
|
|||
|
|
unitName: '', // 单位
|
|||
|
|
storageNum: '', // 库存数量
|
|||
|
|
preNum: '', // 预领数量
|
|||
|
|
parentId: query.id, // 出库时所需参数 取列表 id
|
|||
|
|
id: '', // 出库时所需参数 取详情接口 id
|
|||
|
|
typeId: '', // 出库时所需参数 取详情接口 typeId
|
|||
|
|
manageType: '', // 出库时所需参数 取详情接口 manageType
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 获取列表详情
|
|||
|
|
const getOutboundDetailsData = async () => {
|
|||
|
|
const res = await getRepairDetailsAPI({ taskId: query.taskId })
|
|||
|
|
detailsList.value = res.data
|
|||
|
|
detailsList.value = detailsList.value.map((e) => {
|
|||
|
|
return { ...e, isChecked: false }
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 复选框全选
|
|||
|
|
const onChangeAllChecked = (e) => {
|
|||
|
|
console.log('全选', e.detail.value)
|
|||
|
|
}
|
|||
|
|
// 复选框每一项
|
|||
|
|
const onChangeChecked = (val) => {
|
|||
|
|
val = !val
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 点击跳转出库页面
|
|||
|
|
const onCodingItem = (item) => {
|
|||
|
|
// 解构所需要的数据
|
|||
|
|
const {
|
|||
|
|
status,
|
|||
|
|
manageType,
|
|||
|
|
maTypeName,
|
|||
|
|
typeName,
|
|||
|
|
storageNum,
|
|||
|
|
preNum,
|
|||
|
|
alNum,
|
|||
|
|
unitName,
|
|||
|
|
id,
|
|||
|
|
typeId,
|
|||
|
|
} = item
|
|||
|
|
|
|||
|
|
leaseApplyInfo.value.maTypeName = maTypeName
|
|||
|
|
leaseApplyInfo.value.typeName = typeName
|
|||
|
|
leaseApplyInfo.value.unitName = unitName
|
|||
|
|
leaseApplyInfo.value.storageNum = storageNum
|
|||
|
|
leaseApplyInfo.value.preNum = preNum
|
|||
|
|
leaseApplyInfo.value.alNum = alNum
|
|||
|
|
leaseApplyInfo.value.id = id
|
|||
|
|
leaseApplyInfo.value.typeId = typeId
|
|||
|
|
leaseApplyInfo.value.manageType = manageType
|
|||
|
|
|
|||
|
|
if (status == 2) {
|
|||
|
|
uni.showToast({ title: '该物资已完成出库！', icon: 'none' })
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
let codingUrl = ''
|
|||
|
|
if (manageType === 0) {
|
|||
|
|
codingUrl = '/pages/picking/outbound/code-outbound' // 编码出库
|
|||
|
|
}
|
|||
|
|
if (manageType == 1) {
|
|||
|
|
codingUrl = '/pages/picking/outbound/num-outbound' // 数量出库
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 把 leaseApplyInfo 领料信息转成 json 传递到下个页面
|
|||
|
|
uni.navigateTo({ url: `${codingUrl}?queryParams=${JSON.stringify(leaseApplyInfo.value)}` })
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 页面加载完毕
|
|||
|
|
onLoad(() => {
|
|||
|
|
getOutboundDetailsData()
|
|||
|
|
|
|||
|
|
// 监听出库完成事件 刷新列表
|
|||
|
|
uni.$on('onUpdate', () => {
|
|||
|
|
// console.log('监听事件')
|
|||
|
|
// 刷新列表
|
|||
|
|
getOutboundDetailsData()
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
// 页面销毁时移除事件监听
|
|||
|
|
onUnmounted(() => {
|
|||
|
|
uni.$off('onUpdate') // 移除事件监听
|
|||
|
|
})
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.page-container {
|
|||
|
|
display: flex;
|
|||
|
|
height: 100%;
|
|||
|
|
padding: 0 15rpx;
|
|||
|
|
flex-direction: column;
|
|||
|
|
background-color: #e8f5fb;
|
|||
|
|
|
|||
|
|
.search-form {
|
|||
|
|
margin: 10rpx 0;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
box-sizing: content-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.search {
|
|||
|
|
height: 60rpx;
|
|||
|
|
background-color: #3784fb;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 60rpx;
|
|||
|
|
color: #fff;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.table-list-item {
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
background-color: #fff;
|
|||
|
|
// min-height: 300rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
|
|||
|
|
.title {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.line {
|
|||
|
|
margin: 20rpx 0;
|
|||
|
|
height: 1px;
|
|||
|
|
background-color: #e8e8e8;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
// 加载提示文字
|
|||
|
|
.loading-text {
|
|||
|
|
text-align: center;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #666;
|
|||
|
|
padding: 20rpx 0;
|
|||
|
|
}
|
|||
|
|
</style>
|