565 lines
16 KiB
Vue
565 lines
16 KiB
Vue
<template>
|
||
<uni-nav-bar dark :fixed="true" shadow background-color="#4AA4EA" status-bar :title="title"
|
||
><template v-slot:left>
|
||
<view style="font-size: 18px; display: flex; align-items: center" @click="back">
|
||
<!-- 图标 -->
|
||
<uni-icons type="left" size="20" color="#fff"></uni-icons>
|
||
<!-- 文本 -->
|
||
<text>返回</text>
|
||
</view>
|
||
</template>
|
||
<template v-slot:right>
|
||
<view style="font-size: 18px; display: flex; align-items: center" @click="submit(0)">
|
||
<!-- 文本 -->
|
||
<text>暂存</text>
|
||
</view>
|
||
</template>
|
||
</uni-nav-bar>
|
||
<div class="content">
|
||
<uni-section title="任务信息" type="line"></uni-section>
|
||
<uni-forms ref="form" :rules="rules" :model="formData" label-width="80px">
|
||
<uni-forms-item label="工程名称" required name="projectId">
|
||
<uni-data-select
|
||
v-if="!opts.isEdit"
|
||
v-model="formData.projectId"
|
||
:localdata="prodRange"
|
||
:clear="false"
|
||
filterable
|
||
:disabled="opts.isEdit"
|
||
@change="changeProd"
|
||
></uni-data-select>
|
||
<uni-easyinput v-else v-model="formData.proName" disabled></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="退料班组" required name="teamId">
|
||
<uni-data-select
|
||
v-if="!opts.isEdit"
|
||
v-model="formData.teamId"
|
||
:localdata="teamRange"
|
||
:clear="false"
|
||
filterable
|
||
:disabled="opts.isEdit"
|
||
@change="changeTeamd"
|
||
></uni-data-select>
|
||
<uni-easyinput v-else v-model="formData.teamName" disabled></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="退料人员" required name="backPerson">
|
||
<uni-easyinput
|
||
v-model="formData.backPerson"
|
||
placeholder="请输入内容"
|
||
disabled
|
||
></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="联系电话" name="phone">
|
||
<uni-easyinput
|
||
v-model="formData.phone"
|
||
placeholder="请输入内容"
|
||
maxlength="11"
|
||
@blur="checkPhone"
|
||
></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="备注" name="remark">
|
||
<uni-easyinput
|
||
v-model="formData.remark"
|
||
placeholder="请输入内容"
|
||
maxlength="200"
|
||
></uni-easyinput>
|
||
</uni-forms-item>
|
||
<uni-section title="工器具退料" type="line"></uni-section>
|
||
<eselect
|
||
v-model="equipmentId"
|
||
style="width: 100%; height: 90rpx; margin: 10px 0"
|
||
ref="treeSelect"
|
||
:options="equipmentList"
|
||
:disabled="!formData.teamId || !formData.projectId"
|
||
@change="changeEquipment"
|
||
></eselect>
|
||
</uni-forms>
|
||
|
||
<uni-table ref="table" border stripe emptyText="暂无更多数据">
|
||
<uni-tr>
|
||
<uni-th width="60" align="center">序号</uni-th>
|
||
<uni-th width="140" align="center">类型名称</uni-th>
|
||
<uni-th width="140" align="center">规格型号</uni-th>
|
||
<uni-th width="80" align="center">在用数</uni-th>
|
||
<uni-th width="120" align="center">退料数</uni-th>
|
||
<uni-th width="120" align="center">损坏价值判定</uni-th>
|
||
<uni-th width="90" align="center">操作</uni-th>
|
||
</uni-tr>
|
||
<uni-tr v-for="(item, index) in tableData" :key="index">
|
||
<uni-td align="center">{{ index + 1 }}</uni-td>
|
||
<uni-td align="center">{{ item.maTypeName }}</uni-td>
|
||
<uni-td align="center">
|
||
<view class="name">{{ item.typeName }}</view>
|
||
</uni-td>
|
||
<uni-td align="center">{{ item.num }}</uni-td>
|
||
<uni-td align="center">
|
||
<uni-easyinput
|
||
v-if="item.manageType == 1"
|
||
v-model="item.preNum"
|
||
placeholder="请输入数量"
|
||
type="number"
|
||
@change="checkPerNum(item)"
|
||
></uni-easyinput>
|
||
<!-- 编码 -->
|
||
<span v-else style="color: #409eff" @click="getCode(item)">{{
|
||
item.maCodeList.length == 0 ? '选择编码' : item.maCodeList.length
|
||
}}</span>
|
||
</uni-td>
|
||
<uni-td align="center"
|
||
><uni-easyinput v-model="item.apDetection" placeholder="请输入内容"></uni-easyinput
|
||
></uni-td>
|
||
<uni-td align="center">
|
||
<button
|
||
class="uni-button"
|
||
size="mini"
|
||
type="warn"
|
||
@click="
|
||
() => {
|
||
tableData.splice(index, 1)
|
||
}
|
||
"
|
||
>
|
||
删除
|
||
</button>
|
||
</uni-td>
|
||
</uni-tr>
|
||
</uni-table>
|
||
|
||
<button style="width: 100%; margin: 50px 0" type="primary" @click="submit(1)">确 定</button>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { onLoad, onShow, onBackPress } from '@dcloudio/uni-app'
|
||
import { ref, reactive } from 'vue'
|
||
import eselect from '@/pages/materialsStation/toolsLease/components/eselect.vue'
|
||
import {
|
||
getTeamListApi,
|
||
getProjectList,
|
||
backTask,
|
||
editBackTask,
|
||
getAgreementInfoByIdBackApi,
|
||
detailsBackTask,
|
||
getUseTypeTree,
|
||
} from '@/services/materialsStation'
|
||
|
||
const title = ref('工器具退料申请')
|
||
const opts = ref({})
|
||
const form = ref()
|
||
const formData = reactive({
|
||
teamId: undefined,
|
||
projectId: '',
|
||
backPerson: '',
|
||
phone: '',
|
||
agreementIds:[],
|
||
remark: undefined,
|
||
isBack: 1,
|
||
remark: '',
|
||
})
|
||
const agreementIds = ref('')
|
||
const equipmentId = ref()
|
||
const teamRange = ref([]) // 班组
|
||
const prodRange = ref([]) // 工程
|
||
const equipmentList = ref([]) // 工器具
|
||
const rules = {
|
||
teamId: {
|
||
rules: [{ required: true, errorMessage: '请选择班组' }],
|
||
},
|
||
projectId: {
|
||
rules: [{ required: true, errorMessage: '请选择工程' }],
|
||
},
|
||
backPerson: {
|
||
rules: [{ required: true, errorMessage: '请填写退料人' }],
|
||
},
|
||
}
|
||
const tableData = ref([])
|
||
|
||
// 编辑获取详情
|
||
const getDetailsById = async () => {
|
||
try {
|
||
const res = await detailsBackTask(opts.value.id)
|
||
console.log('🚀 ~ getDetailsById ~ res:', res)
|
||
res.data.backApplyInfo.projectId = res.data.backApplyInfo.proId
|
||
if (res.data && res.data.backApplyDetailsList && res.data.backApplyDetailsList.length > 0) {
|
||
tableData.value = res.data.backApplyDetailsList.map((item) => {
|
||
return {
|
||
...item,
|
||
maTypeName: item.materialName, // 显示类型名称
|
||
}
|
||
})
|
||
}
|
||
Object.assign(formData, res.data.backApplyInfo)
|
||
console.log('🚀 ~ getDetailsById ~ formData:', formData)
|
||
getAgreement()
|
||
} catch (error) {
|
||
console.log('🚀 ~ getDetailsById ~ error:', error)
|
||
}
|
||
}
|
||
// 获取班组
|
||
const getTeamList = async () => {
|
||
try {
|
||
const res = await getTeamListApi({ isAll: 0, proId: formData.projectId })
|
||
// teamRange.value = res.data
|
||
if (res.data.length > 0) {
|
||
teamRange.value = res.data.map((item) => {
|
||
return {
|
||
...item,
|
||
value: item.id,
|
||
text: item.teamName,
|
||
}
|
||
})
|
||
// getProjectListApi()
|
||
}
|
||
} catch (error) {
|
||
console.log('🚀 ~ getTeamList ~ error:', error)
|
||
}
|
||
}
|
||
// 获取工程
|
||
const getProjectListApi = async () => {
|
||
console.log('🚀 ~ 工程')
|
||
try {
|
||
const res = await getProjectList({ unitId: null, isApp: true, teamId: formData.teamId })
|
||
if (!res.data || !res.data.length) return
|
||
console.log('🚀 ~ getProjectListApi ~ res:', res)
|
||
prodRange.value = res.data.map((item) => {
|
||
return {
|
||
...item,
|
||
value: item.proId,
|
||
text: item.proName,
|
||
}
|
||
})
|
||
} catch (error) {
|
||
console.log('🚀 ~ getProjectListApi ~ error:', error)
|
||
}
|
||
}
|
||
//协议
|
||
const getAgreement = () => {
|
||
console.log(formData.teamId, formData.projectId)
|
||
let obj = {
|
||
teamId: formData.teamId,
|
||
projectId: formData.projectId,
|
||
}
|
||
getAgreementInfoByIdBackApi(obj)
|
||
.then((res) => {
|
||
console.log(res)
|
||
if (res.code == 200 && res.data && res.data.length>0) {
|
||
agreementIds.value = res.data.map(item => item.agreementId)
|
||
formData.agreementIds = res.data.map(item => item.agreementId)
|
||
getEquipmentList()
|
||
} else {
|
||
agreementIds.value = ''
|
||
formData.agreementIds = ''
|
||
}
|
||
})
|
||
.catch((error) => {
|
||
formData.agreementIds = ''
|
||
console.log(error)
|
||
})
|
||
}
|
||
// 获取工具器
|
||
const getEquipmentList = async () => {
|
||
try {
|
||
let obj = {
|
||
agreementIds: agreementIds.value,
|
||
}
|
||
const res = await getUseTypeTree(obj)
|
||
// machineList.value = res.data
|
||
if (res.data.length > 0) {
|
||
equipmentList.value = formatEquipmentTree(res.data)
|
||
console.log('🚀 ~ getEquipmentList ~ machineList.value:', equipmentList.value)
|
||
}
|
||
} catch (error) {
|
||
console.log('🚀 ~ getMachineListApi ~ error:', error)
|
||
}
|
||
}
|
||
function formatEquipmentTree(list) {
|
||
return list.map((item) => {
|
||
const newItem = {
|
||
...item,
|
||
id: item.typeId,
|
||
name: item.typeName,
|
||
}
|
||
if (item.children && item.children.length > 0) {
|
||
newItem.children = formatEquipmentTree(item.children)
|
||
}
|
||
return newItem
|
||
})
|
||
}
|
||
// 校验电话
|
||
const checkPhone = (rule, value, callback) => {
|
||
// if (!formData.phone) {
|
||
// uni.showToast({
|
||
// icon: 'none',
|
||
// title: '请输入电话号码',
|
||
// })
|
||
// return false
|
||
// }
|
||
if (!/^1[3-9][0-9]{9}$/.test(formData.phone)) {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '请输入正确的电话号码',
|
||
})
|
||
// 清空
|
||
formData.phone = ''
|
||
return false
|
||
}
|
||
return true
|
||
}
|
||
|
||
// 检查数量
|
||
const checkPerNum = (item) => {
|
||
if (item.unitValue == 1) {
|
||
item.preNum = Number(String(item.preNum).replace(/[^\d.]/g, ''))
|
||
} else {
|
||
item.preNum = Number(String(item.preNum).replace(/[^\d]/g, ''))
|
||
}
|
||
// 大于1的正整数 正则校验
|
||
// if (!/^[1-9]\d*$/.test(item.preNum)) {
|
||
// uni.showToast({
|
||
// icon: 'none',
|
||
// title: '请输入正确的数量',
|
||
// })
|
||
// // 重置为1
|
||
// item.preNum = 1
|
||
// return false
|
||
// }
|
||
}
|
||
// 选择班组
|
||
const changeTeamd = (e) => {
|
||
console.log('🚀 ~ changeTeamd ~ e:', e)
|
||
const team = teamRange.value.find((item) => item.id === e)
|
||
console.log('🚀 ~ changeTeamd ~ team:', team)
|
||
// formData.projectId = null
|
||
formData.teamName = team ? team.teamName : ''
|
||
formData.backPerson = team ? team.relName : ''
|
||
formData.phone = team ? team.relPhone : ''
|
||
formData.relName = team ? team.relName : ''
|
||
formData.teamId = e
|
||
// getProjectListApi()
|
||
getAgreement()
|
||
}
|
||
// 选择工程
|
||
const changeProd = (e) => {
|
||
console.log('🚀 ~ changeProd ~ e:', e)
|
||
formData.projectId = e
|
||
getTeamList()
|
||
}
|
||
// 选择工器具
|
||
const changeEquipment = (e) => {
|
||
console.log('🚀 ~ changeEquipment ~ e:', e)
|
||
if (tableData.value.some((item) => item.typeId === e.typeId)) {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '该型号已添加',
|
||
})
|
||
return
|
||
}
|
||
|
||
// 从 equipmentList.value 中获取点击id的上一级的 typeName
|
||
const equipment = findEquipmentById(equipmentList.value, e.parentId)
|
||
tableData.value.unshift({
|
||
...JSON.parse(JSON.stringify(e)),
|
||
maTypeName: equipment.typeName,
|
||
preNum: e.manageType == '1' ? 1 : 0, // 如果是数量设备，默认退料数为1
|
||
maCodeList: [],
|
||
})
|
||
setTimeout(() => {
|
||
equipmentId.value = ''
|
||
}, 300)
|
||
console.log('xxxxxxxxxxxxxxxxx:', tableData.value)
|
||
}
|
||
// 递归查找指定 id 的节点
|
||
function findEquipmentById(list, id) {
|
||
for (const item of list) {
|
||
if (item.id === id) {
|
||
return item
|
||
}
|
||
if (item.children && item.children.length > 0) {
|
||
const found = findEquipmentById(item.children, id)
|
||
if (found) return found
|
||
}
|
||
}
|
||
return null
|
||
}
|
||
|
||
// 获取编码
|
||
const getCode = (item) => {
|
||
console.log('🚀 ~ getCode ~ item:', item)
|
||
if (item.maCodeList.length > 0) {
|
||
item.maCodeList.forEach((code) => {
|
||
code.checked = true
|
||
})
|
||
}
|
||
item.isEdit = opts.value.isEdit
|
||
item.isBack = true
|
||
item.teamId = formData.teamId
|
||
item.projectId = formData.projectId
|
||
uni.navigateTo({
|
||
url: '/pages/materialsStation/toolsLease/codeOut?params=' + JSON.stringify(item),
|
||
})
|
||
}
|
||
|
||
const submit = (isBack) => {
|
||
console.log('🚀 ~ submit ~ submit:', formData)
|
||
// 校验表单
|
||
form.value
|
||
.validate()
|
||
.then(async (valid) => {
|
||
formData.isBack = isBack
|
||
formData.createBy = uni.getStorageSync('username') || ''
|
||
console.log('🚀 ~ form.value.validate.then ~ valid:', valid)
|
||
if (tableData.value.length === 0) {
|
||
await uni.showToast({
|
||
title: '请添加退料数据',
|
||
icon: 'none',
|
||
duration: 1000,
|
||
})
|
||
return
|
||
}
|
||
// tableData.value 循环 preNum 不能小于 0, 小于0的提示到具体行
|
||
for (let i = 0; i < tableData.value.length; i++) {
|
||
console.log('🚀yyyyyyyyyyyyyyyyyyy:', tableData.value[i].unitValue)
|
||
if (tableData.value[i].preNum < 1 && tableData.value[i].unitValue == 0 ) {
|
||
await uni.showToast({
|
||
title: `第${i + 1}行退料数量不能为0`,
|
||
icon: 'none',
|
||
duration: 1000,
|
||
})
|
||
return
|
||
}else if(tableData.value[i].preNum <= 0 && tableData.value[i].unitValue == 1){
|
||
await uni.showToast({
|
||
title: `第${i + 1}行退料数量不能为0`,
|
||
icon: 'none',
|
||
duration: 1000,
|
||
})
|
||
}else if (tableData.value[i].preNum > tableData.value[i].num) {
|
||
await uni.showToast({
|
||
title: `第${i + 1}行退料数量不能大于在用数量`,
|
||
icon: 'none',
|
||
duration: 1000,
|
||
})
|
||
return
|
||
}
|
||
}
|
||
|
||
const res = await uni.showModal({
|
||
title: '提示',
|
||
content: '是否确认提交？',
|
||
confirmText: '确定',
|
||
cancelText: '取消',
|
||
})
|
||
console.log('🚀 ~ .then ~ res:', res)
|
||
if (!res.confirm) return
|
||
tableData.value.forEach((item) => {
|
||
item.outNum = item.preNum
|
||
})
|
||
const params = {
|
||
backApplyDetailsList: tableData.value,
|
||
backApplyInfo: formData,
|
||
}
|
||
console.log('🚀 yyyyyyyyyyy:', params)
|
||
uni.showLoading({
|
||
title: '提交中...',
|
||
})
|
||
try {
|
||
let res = null
|
||
if (!opts.value.isEdit) {
|
||
console.log('🚀 ~ .then ~ 新增:')
|
||
res = await backTask(params)
|
||
} else {
|
||
console.log('🚀 ~ .then ~ 编辑:')
|
||
res = await editBackTask(params)
|
||
}
|
||
console.log('🚀 ~ .then ~ res:', res)
|
||
tableData.value = []
|
||
uni.hideLoading()
|
||
back()
|
||
} catch (error) {
|
||
console.log('🚀 ~ .then ~ error:', error)
|
||
uni.hideLoading()
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
console.log('🚀 ~ form.value.validate.catch ~ err:', err)
|
||
})
|
||
}
|
||
const back = () => {
|
||
if (tableData.value.length > 0) {
|
||
uni
|
||
.showModal({
|
||
title: '提示',
|
||
content: '当前有未提交的数据，是否暂存？',
|
||
confirmText: '确定',
|
||
cancelText: '取消',
|
||
})
|
||
.then((res) => {
|
||
if (res.confirm) {
|
||
submit(0)
|
||
} else {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
})
|
||
}
|
||
})
|
||
} else {
|
||
uni.navigateBack({
|
||
delta: 1,
|
||
})
|
||
}
|
||
}
|
||
|
||
onLoad((opt) => {
|
||
console.log('onLoad', opt)
|
||
opts.value = opt.params ? JSON.parse(opt.params) : {}
|
||
title.value = opts.value.isEdit ? '编辑工器具退料' : '新增工器具退料'
|
||
if (opts.value.isEdit) {
|
||
getDetailsById()
|
||
} else {
|
||
// getTeamList()
|
||
getProjectListApi()
|
||
}
|
||
})
|
||
onShow(() => {
|
||
console.log('onShow')
|
||
// 监听添加编码
|
||
uni.$on('maCodeList', (data) => {
|
||
console.log('🚀 ~ onShow ~ data:', data)
|
||
const item = tableData.value.find((item) => item.typeId == data[0].typeId)
|
||
console.log('🚀 ~ onShow ~ item:', item)
|
||
if (item) {
|
||
item.maCodeList = data
|
||
item.preNum = data.length
|
||
}
|
||
})
|
||
console.log('🚀 ~ onShow ~ tableData.value:', tableData.value)
|
||
})
|
||
onBackPress((opt) => {
|
||
console.log('🚀 ~ onBackPress ~ opt:', opt)
|
||
if (opt.from == 'backbutton') {
|
||
if (tableData.value.length > 0) {
|
||
// 仅提示数据未提交
|
||
uni.showToast({
|
||
title: '当前有未提交数据, 请暂存或提交',
|
||
icon: 'none',
|
||
duration: 1000,
|
||
})
|
||
return true
|
||
}
|
||
} else {
|
||
return false
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.content {
|
||
padding: 10px;
|
||
background-color: #fafafa;
|
||
}
|
||
.col {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 15px;
|
||
}
|
||
</style>
|