421 lines
13 KiB
Vue
421 lines
13 KiB
Vue
<template>
|
||
<!-- 新购验收详情 -->
|
||
<view class="accept page-common">
|
||
<uni-row :gutter="24" class="search-form">
|
||
<uni-col :span="18">
|
||
<view>
|
||
<uni-easyinput placeholder="请输入内容" v-model="searchValue" maxlength="10" />
|
||
</view>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="search" @click="search">查询</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24" class="sect-form">
|
||
<uni-section title="审核记录" type="line" padding>
|
||
<uni-steps :options="auditingList" :active="activeSect" />
|
||
</uni-section>
|
||
</uni-row>
|
||
<uni-row :gutter="24" class="check-form" v-if="!isFinished">
|
||
<!-- <div style="display: flex; justify-content: space-between; align-items: center">
|
||
<checkbox-group @change="onAllChecked">
|
||
<checkbox
|
||
color="#409eff"
|
||
borderColor="#409eff"
|
||
activeBorderColor="#409eff"
|
||
:checked="allChecked"
|
||
/>
|
||
</checkbox-group>
|
||
<div>全选 {{ checkedCount }}/{{ tableList.length }}</div>
|
||
</div> -->
|
||
<div>
|
||
<button type="primary" size="mini" @click="handleAllSubmit(true)">合格</button>
|
||
</div>
|
||
<div>
|
||
<button type="warn" size="mini" @click="handleAllSubmit(false)">不合格</button>
|
||
</div>
|
||
</uni-row>
|
||
<scroll-view scroll-y class="scroll-container">
|
||
<div
|
||
class="table-list-item"
|
||
v-for="(item, index) in tableList"
|
||
:key="index"
|
||
>
|
||
<div class="title">
|
||
<span>
|
||
<!-- <checkbox-group @change="onChangeChecked(item)">
|
||
<checkbox
|
||
color="#409eff"
|
||
borderColor="#409eff"
|
||
activeBorderColor="#409eff"
|
||
:checked="item.isChecked"
|
||
:disabled="item.status != '2'"
|
||
/>
|
||
</checkbox-group> -->
|
||
新购验收
|
||
</span>
|
||
<span :class="item.status == 2 ? 'pending' : 'completed'">
|
||
{{ item.status == 2 ? '未验收' : '已验收' }}
|
||
</span>
|
||
</div>
|
||
<div class="line"></div>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="6">物资名称:</uni-col>
|
||
<uni-col :span="18"
|
||
><div class="cont">{{ item.maTypeName }}</div></uni-col
|
||
>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="6">规格型号:</uni-col>
|
||
<uni-col :span="18"
|
||
><div class="cont">{{ item.typeName }}</div></uni-col
|
||
>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="6">到货数量:</uni-col>
|
||
<uni-col :span="18"
|
||
><div class="cont">{{ item.purchaseNum }}</div></uni-col
|
||
>
|
||
</uni-row>
|
||
<uni-row :gutter="24">
|
||
<uni-col :span="6">验收数量:</uni-col>
|
||
<uni-col :span="18"
|
||
><div class="cont">{{ item.purchaseNum }}</div></uni-col
|
||
>
|
||
</uni-row>
|
||
<uni-row :gutter="24" v-if="item.status != 2">
|
||
<uni-col :span="6">原因:</uni-col>
|
||
<uni-col :span="18"
|
||
><div class="cont">{{ item.reason }}</div></uni-col
|
||
>
|
||
</uni-row>
|
||
</div>
|
||
<div class="loading-text">
|
||
{{ '没有更多数据了~' }}
|
||
</div>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive, computed } from 'vue'
|
||
import { getPurchaseInfo, innerVerify, getSignListApi } from '../../../services/purchase.js'
|
||
import { onLoad, onShow } from '@dcloudio/uni-app'
|
||
const searchValue = ref('')
|
||
const id = ref('')
|
||
const taskId = ref('')
|
||
const isFinished = ref(false)
|
||
const statusList = ref(['2', '12'])
|
||
const tableList = ref([])
|
||
const allChecked = ref(false)
|
||
const auditingList = ref([
|
||
{ title: '供应科审核', desc: '' },
|
||
{ title: '技术科审核' },
|
||
{ title: '库管班审核' },
|
||
])
|
||
const activeSect = ref(0)
|
||
const checkedCount = computed(
|
||
() => tableList.value.filter((item) => item.status == 2 && item.isChecked).length,
|
||
)
|
||
|
||
const getSignList = async () => {
|
||
try {
|
||
const res = await getSignListApi({ taskId: taskId.value })
|
||
if (res.code === 200 && res.data && res.data.length > 0) {
|
||
auditingList.value = res.data.map((item, index) => {
|
||
return {
|
||
...item,
|
||
title: item.deptName + '审核',
|
||
desc: item.auditStatusName + '\n' + (index == 0 ? '姚士超' : item.userName || '') + '\n' + item.createTime + '\n' + (item.auditRemark || '')
|
||
}
|
||
})
|
||
activeSect.value = auditingList.value.length - 1
|
||
const auditSteps = [
|
||
{ title: '技术科审核', desc: '待审核' },
|
||
{ title: '库管班审核', desc: '待审核' }
|
||
]
|
||
if (auditingList.value.length === 1) {
|
||
auditingList.value.push(...auditSteps)
|
||
} else if (auditingList.value.length === 2) {
|
||
auditingList.value.push(auditSteps[1])
|
||
}
|
||
}
|
||
} catch (error) {
|
||
console.log('🚀 ~ getSignList ~ error:', error)
|
||
}
|
||
}
|
||
const getTableList = () => {
|
||
let obj = {
|
||
id: id.value,
|
||
taskId: taskId.value,
|
||
statusList: statusList.value,
|
||
taskStage: 2,
|
||
keyWord: searchValue.value,
|
||
}
|
||
console.log(obj)
|
||
getPurchaseInfo(obj)
|
||
.then((res) => {
|
||
console.log(res)
|
||
tableList.value = res.data.purchaseCheckDetailsList
|
||
if (tableList.value.length > 0) {
|
||
tableList.value.forEach((item) => {
|
||
item.isChecked = false
|
||
})
|
||
}
|
||
console.log(tableList.value)
|
||
})
|
||
.catch((error) => {
|
||
console.log(error)
|
||
})
|
||
}
|
||
const search = () => {
|
||
console.log('🚀 ~ search ~ searchValue:', searchValue.value)
|
||
getTableList()
|
||
}
|
||
const handleItem = (item) => {
|
||
console.log('🚀 ~ handleItem ~ item:', item)
|
||
if (item.status == 2) {
|
||
uni.navigateTo({
|
||
url: `/pages/new-purchase/accept/conclusion?item=${JSON.stringify(item)}`,
|
||
})
|
||
} else {
|
||
// 提示已验收
|
||
uni.showToast({
|
||
title: '已完成验收',
|
||
icon: 'none',
|
||
})
|
||
}
|
||
}
|
||
// 多选框选中
|
||
const onChangeChecked = (item) => {
|
||
item.isChecked = !item.isChecked
|
||
allChecked.value = tableList.value.every((item) => item.isChecked)
|
||
console.log('🚀 ~ onChangeChecked ~ item:', item)
|
||
}
|
||
// 全选
|
||
const onAllChecked = () => {
|
||
allChecked.value = !allChecked.value
|
||
tableList.value.forEach((item) => {
|
||
if (item.status == 2) {
|
||
console.log('全选的', allChecked.value)
|
||
item.isChecked = allChecked.value ? true : false
|
||
}
|
||
})
|
||
console.log('🚀 ~ tableList.value.forEach ~ tableList.value:', tableList.value)
|
||
}
|
||
// 批量合格
|
||
const handleAllSubmit = (bool) => {
|
||
console.log('🚀 ~ handleAllSubmit ~ bool:', bool)
|
||
const connect = bool ? '确定合格吗?' : '确定不合格吗?'
|
||
// 弹框确定
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: connect,
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
// 获取选中的行数据
|
||
// const checkedRows = tableList.value.filter(item => item.isChecked)
|
||
// console.log('🚀 ~ success: ~ checkedRows:', checkedRows)
|
||
const purchaseCheckDetailsList = tableList.value.map(item => {
|
||
return {
|
||
taskId: item.taskId,
|
||
typeId: item.typeId,
|
||
status: bool ? '3' : '1',
|
||
checkResult: bool ? '合格' : '不合格',
|
||
manageType: item.manageType
|
||
}
|
||
})
|
||
const param = {
|
||
purchaseCheckDetailsList,
|
||
verifyPass: bool
|
||
}
|
||
console.log('🚀 ~ success: ~ param:', param)
|
||
try {
|
||
const res = await innerVerify(param)
|
||
console.log('🚀 ~ success: ~ res:', res)
|
||
uni.showToast({
|
||
title: '操作成功',
|
||
icon: 'success'
|
||
})
|
||
allChecked.value = false
|
||
getTableList()
|
||
// 返回
|
||
uni.navigateBack()
|
||
} catch (error) {
|
||
console.log('🚀 ~ success: ~ error:', error)
|
||
}
|
||
}
|
||
},
|
||
})
|
||
}
|
||
onLoad((options) => {
|
||
console.log(options)
|
||
id.value = options.id
|
||
taskId.value = options.taskId
|
||
isFinished.value = options.isFinished ? JSON.parse(options.isFinished) : false
|
||
getTableList()
|
||
getSignList()
|
||
})
|
||
onShow(() => {
|
||
getTableList()
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.accept {
|
||
height: 100vh;
|
||
word-break: break-all;
|
||
background-color: #f7f8fa;
|
||
padding: 24rpx;
|
||
overflow-y: auto;
|
||
|
||
.search-form {
|
||
display: flex;
|
||
align-items: center;
|
||
background: #fff;
|
||
padding: 24rpx;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 20rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||
|
||
:deep(.uni-easyinput__content) {
|
||
background-color: #f7f8fa;
|
||
border: 2rpx solid #e8e8e8;
|
||
border-radius: 12rpx;
|
||
height: 80rpx;
|
||
transition: all 0.3s ease;
|
||
|
||
&:focus-within {
|
||
border-color: #3784fb;
|
||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||
}
|
||
}
|
||
}
|
||
|
||
.search {
|
||
height: 80rpx;
|
||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||
text-align: center;
|
||
line-height: 80rpx;
|
||
color: #fff;
|
||
border-radius: 12rpx;
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
transform: translateY(2rpx);
|
||
opacity: 0.9;
|
||
}
|
||
}
|
||
}
|
||
.check-form {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
background: #fff;
|
||
padding: 24rpx 0;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 20rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||
}
|
||
.sect-form {
|
||
/* display: flex;
|
||
justify-content: space-between;
|
||
align-items: center; */
|
||
background: #fff;
|
||
padding: 24rpx 0;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 20rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||
}
|
||
.scroll-container {
|
||
padding: 0 2rpx;
|
||
}
|
||
.table-list-item {
|
||
margin: 24rpx 0;
|
||
padding: 32rpx;
|
||
background-color: #fff;
|
||
min-height: 300rpx;
|
||
border-radius: 20rpx;
|
||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
transform: scale(0.985);
|
||
background-color: #fafbfc;
|
||
}
|
||
|
||
.title {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 20rpx;
|
||
|
||
span:first-child {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #3784fb;
|
||
letter-spacing: 1rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
span:last-child {
|
||
padding: 8rpx 28rpx;
|
||
border-radius: 8rpx;
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
|
||
&.completed {
|
||
background-color: rgba(55, 132, 251, 0.1);
|
||
color: #3784fb;
|
||
}
|
||
|
||
&.pending {
|
||
background-color: rgba(250, 140, 22, 0.1);
|
||
color: #fa8c16;
|
||
}
|
||
}
|
||
}
|
||
|
||
.line {
|
||
margin: 24rpx 0;
|
||
height: 2rpx;
|
||
background: linear-gradient(
|
||
90deg,
|
||
rgba(232, 232, 232, 0) 0%,
|
||
rgba(232, 232, 232, 1) 50%,
|
||
rgba(232, 232, 232, 0) 100%
|
||
);
|
||
}
|
||
|
||
:deep(.uni-row) {
|
||
margin-bottom: 20rpx;
|
||
|
||
.uni-col-6 {
|
||
color: #8c8c8c;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
|
||
.cont {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
line-height: 1.8;
|
||
color: #262626;
|
||
font-size: 28rpx;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
.loading-text {
|
||
text-align: center;
|
||
font-size: 26rpx;
|
||
color: #8c8c8c;
|
||
padding: 32rpx 0;
|
||
letter-spacing: 1rpx;
|
||
}
|
||
</style>
|