bonus-material-app/src/pages/materialsStation/materialClerkConfirms/confirmDetails.vue

154 lines
3.7 KiB
Vue

<template>
<div class="content">
<!-- 滚动列表 -->
<scroll-view scroll-y @scrolltolower="onScrollTolower">
<div class="list" v-for="(item, index) in tableList" @click="handleDetails(item)">
<div style="margin-right: 8px">{{ index + 1 }}.</div>
<div class="item">
<div>物资名称: {{ item.maTypeName }}</div>
<div>规格型号: {{ item.typeName }}</div>
<div>计量单位: {{ item.unitName }}</div>
<div>出库数量: {{ item.outNum || 0 }}</div>
<div>出库方式: {{ item.manageType == 1 ? '数量出库' : '编码出库' }}</div>
<div>备注: {{ item.remark }}</div>
</div>
</div>
<button v-if="opts.isConfirm == 1" type="primary" style="margin-top: 30px" @click="penPopup">
确 认
</button>
</scroll-view>
</div>
<!-- 填写备注的弹框 -->
<uni-popup ref="popup" type="dialog">
<view class="popup-content">
<view class="popup-title">材料员确认</view>
<uni-easyinput type="textarea" v-model="remark" placeholder="请输入备注..." autoHeight />
<view class="popup-btns">
<button type="default" @click="closePopup">取 消</button>
<button type="primary" @click="confirmRemark"> </button>
</view>
</view>
</uni-popup>
</template>
<script setup>
import { onLoad, onShow } from '@dcloudio/uni-app'
import { ref, reactive, computed } from 'vue'
import { getLeaseRequestVoApi, confirmMaterialApi } from '@/services/materialsStation'
const opts = ref(null)
const tableList = ref([])
const total = ref(0)
const remark = ref('')
const popup = ref()
const loading = ref(false)
const finish = computed(() => {
if (total.value === tableList.value.length) return true
})
onShow((opt) => {})
onLoad((opt) => {
console.log('🚀 ~ onLoad ~ opt:', opt)
opts.value = opt.params ? JSON.parse(opt.params) : {}
console.log('🚀 ~ opts.value:', opts.value)
getList()
})
const onScrollTolower = () => {
if (finish.value) return
queryParams.pageSize += 10
getList()
}
const getList = async () => {
try {
const res = await getLeaseRequestVoApi(opts.value)
tableList.value = res.data.leaseApplyDetailsList
} catch (error) {
console.log('🚀 ~ getList ~ error:', error)
}
}
const handleDetails = (item) => {
console.log('🚀 ~ handleDetails ~ item:', item)
}
const penPopup = () => {
popup.value.open()
}
const closePopup = () => {
popup.value.close()
}
const confirmRemark = () => {
console.log('opts:', opts.value)
const params = {
id: opts.value.id,
leaseSignId: opts.value.leaseSignId,
isConfirm: 2,
confirmRemark: remark.value,
}
if (loading.value) return
loading.value = true
// loading
uni.showLoading({
title: '提交中...',
})
confirmMaterialApi(params)
.then((res) => {
popup.value.close()
uni.hideLoading()
loading.value = false
// 返回
uni.navigateBack()
})
.catch((err) => {
console.log('err:', err)
loading.value = false
uni.hideLoading()
})
}
</script>
<style lang="scss" scoped>
.content {
padding: 10px;
height: calc(100vh - 147px);
.query {
display: flex;
justify-content: space-between;
align-items: center;
color: #f0a037;
}
.list {
min-height: 120px;
margin-bottom: 10px;
background: #fafafa;
border-radius: 6px;
padding: 8px;
display: flex;
}
}
.popup-content {
padding: 20rpx;
background-color: #fff;
border-radius: 10rpx;
width: 80vw;
}
.popup-title {
font-size: 32rpx;
font-weight: bold;
margin-bottom: 20rpx;
}
.popup-btns {
display: flex;
justify-content: center;
margin-top: 20rpx;
}
.popup-btns button {
/* margin-left: 20rpx; */
}
</style>