346 lines
9.7 KiB
Vue
346 lines
9.7 KiB
Vue
<template>
|
|
<view style="background-color: rgb(220, 244, 255)">
|
|
<uni-nav-bar
|
|
status-bar
|
|
left-icon="left"
|
|
@clickLeft="leftClick"
|
|
right-icon="scan"
|
|
@clickRight="rightClick"
|
|
title="退料新增"
|
|
title-style="font-weight: bolder;"
|
|
backgroundColor="rgb(220, 244, 255)"
|
|
:border="false"
|
|
/>
|
|
</view>
|
|
<view class="accept page-common">
|
|
<div class="card">
|
|
<uni-forms :model="formData" label-width="170rpx" :border="true">
|
|
<uni-forms-item label="退料单位：" name="unitId">
|
|
<eselect
|
|
style="width: 100%; height: 90rpx"
|
|
ref="treeSelect"
|
|
:options="unitList"
|
|
@change="getProject"
|
|
@clear="clearUnit"
|
|
></eselect>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="退料工程：" name="proId">
|
|
<eselect
|
|
style="width: 100%; height: 90rpx"
|
|
ref="treeSelect2"
|
|
:options="proList"
|
|
@change="changePro"
|
|
@clear="clearPro"
|
|
></eselect>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="退料人员：" name="backPerson">
|
|
<uni-easyinput v-model="backPerson" maxlength="10" placeholder="请输入退料人" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="联系电话：" name="phone">
|
|
<uni-easyinput v-model="phone" maxlength="11" placeholder="请输入联系电话" />
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
</div>
|
|
|
|
<div class="btn">
|
|
<button class="btn-cont" @click="clearForm">清空</button>
|
|
<button class="btn-cont" @click="confirmAdd">确认</button>
|
|
</div>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, reactive } from 'vue'
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import {
|
|
getUnitList,
|
|
getProjectList,
|
|
insertApp,
|
|
getAgreementInfoById,
|
|
} from '../../services/back.js'
|
|
import eselect from '@/components/tree-select/eselect.vue'
|
|
import { useMemberStore } from '@/stores'
|
|
const memberStore = useMemberStore()
|
|
const treeSelect = ref(null)
|
|
const treeSelect2 = ref(null)
|
|
const formData = ref({})
|
|
const unitId = ref('')
|
|
const proId = ref('')
|
|
const agreementId = ref('')
|
|
const unitList = ref([])
|
|
const proList = ref([])
|
|
const backPerson = ref('')
|
|
const phone = ref('')
|
|
|
|
//单位
|
|
const getUnit = () => {
|
|
// proId.value=e.id;
|
|
let obj = {
|
|
projectId: proId.value,
|
|
}
|
|
getUnitList(obj)
|
|
.then((res) => {
|
|
console.log(res)
|
|
unitList.value = res.data
|
|
// getAgreement()
|
|
if (unitId.value && proId.value) {
|
|
getAgreement()
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
}
|
|
//工程
|
|
const getProject = (e) => {
|
|
console.log('🚀 ~ getProject ~ e:', e)
|
|
unitId.value = e?.id || ''
|
|
let obj = {
|
|
unitId: unitId.value,
|
|
// "isApp":true
|
|
}
|
|
getProjectList(obj)
|
|
.then((res) => {
|
|
proList.value = res.data
|
|
// proId.value=""
|
|
// treeSelect2.value.clearInput();
|
|
agreementId.value = ''
|
|
if (unitId.value && proId.value) {
|
|
getAgreement()
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
}
|
|
const clearUnit = () => {
|
|
unitId.value = ''
|
|
agreementId.value = ''
|
|
getUnit()
|
|
getProject()
|
|
}
|
|
const clearPro = () => {
|
|
proId.value = ''
|
|
agreementId.value = ''
|
|
getProject()
|
|
getProject()
|
|
}
|
|
//工程选择
|
|
const changePro = (e) => {
|
|
console.log(e)
|
|
proId.value = e.id
|
|
getUnit()
|
|
// getAgreement()
|
|
}
|
|
//协议
|
|
const getAgreement = () => {
|
|
let obj = {
|
|
unitId: unitId.value,
|
|
projectId: proId.value,
|
|
}
|
|
getAgreementInfoById(obj)
|
|
.then((res) => {
|
|
console.log(res)
|
|
if (res.code == 200) {
|
|
agreementId.value = res.data.agreementId
|
|
} else {
|
|
agreementId.value = ''
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
}
|
|
|
|
//清空
|
|
const clearForm = () => {
|
|
unitId.value = ''
|
|
proId.value = ''
|
|
backPerson.value = ''
|
|
phone.value = ''
|
|
agreementId.value = ''
|
|
treeSelect.value.clearInput()
|
|
treeSelect2.value.clearInput()
|
|
getUnit()
|
|
// getProject()
|
|
}
|
|
//确认
|
|
const confirmAdd = () => {
|
|
if (agreementId.value == '') {
|
|
uni.showToast({ title: '请确认退料单位,退料工程!', icon: 'none' })
|
|
} else if (backPerson.value == '') {
|
|
uni.showToast({ title: '请确认退料人!', icon: 'none' })
|
|
} else {
|
|
let obj = {
|
|
backApplyInfo: {
|
|
agreementId: agreementId.value,
|
|
backPerson: backPerson.value,
|
|
phone: phone.value,
|
|
},
|
|
}
|
|
insertApp(obj)
|
|
.then((res) => {
|
|
console.log(res)
|
|
if (res.code == 200) {
|
|
uni.showToast({ title: '新增成功', icon: 'none' })
|
|
uni.navigateBack({
|
|
delta: 1, // 返回到已存在的页面
|
|
})
|
|
} else {
|
|
uni.showToast({ title: res.msg, icon: 'none' })
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
}
|
|
}
|
|
const leftClick = () => {
|
|
console.log(1)
|
|
uni.navigateBack({
|
|
delta: 1, // 返回到已存在的页面
|
|
})
|
|
}
|
|
const rightClick = () => {
|
|
console.log(2)
|
|
uni.navigateTo({ url: `/pages/back/backCodeAdd` })
|
|
}
|
|
onLoad((options) => {
|
|
getUnit()
|
|
getProject()
|
|
// formData.value = JSON.parse(options.item)
|
|
// backPerson.value = memberStore.userInfo.nickName
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.accept {
|
|
padding: 24rpx;
|
|
height: 90vh;
|
|
word-break: break-all;
|
|
background-color: #f7f8fa;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
// 卡片样式
|
|
.card {
|
|
padding: 32rpx;
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
|
margin-bottom: 24rpx;
|
|
height: auto;
|
|
|
|
// 表单样式
|
|
:deep(.uni-forms) {
|
|
.uni-forms-item {
|
|
padding: 24rpx 0;
|
|
margin-bottom: 0;
|
|
border-bottom: 2rpx solid #f5f5f5;
|
|
|
|
&:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.uni-forms-item__label {
|
|
color: #8c8c8c;
|
|
}
|
|
|
|
// 下拉选择框样式
|
|
.uni-data-select {
|
|
.uni-select {
|
|
border: 2rpx solid #e8e8e8;
|
|
border-radius: 12rpx;
|
|
height: 88rpx;
|
|
padding: 0 24rpx;
|
|
transition: all 0.3s ease;
|
|
|
|
&:focus-within {
|
|
border-color: #3784fb;
|
|
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
|
}
|
|
|
|
.uni-select__input-box {
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
}
|
|
|
|
.uni-select__input-text {
|
|
font-size: 28rpx;
|
|
color: #262626;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 输入框样式
|
|
.uni-easyinput {
|
|
.uni-easyinput__content {
|
|
background-color: #f7f8fa;
|
|
border: 2rpx solid #e8e8e8;
|
|
border-radius: 12rpx;
|
|
height: 75rpx;
|
|
padding: 0 24rpx;
|
|
transition: all 0.3s ease;
|
|
|
|
&:focus-within {
|
|
border-color: #3784fb;
|
|
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
|
}
|
|
|
|
.uni-easyinput__content-input {
|
|
font-size: 28rpx;
|
|
height: 75rpx;
|
|
line-height: 75rpx;
|
|
color: #262626;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// 底部按钮
|
|
.btn {
|
|
margin-top: auto;
|
|
padding: 32rpx;
|
|
// background: #fff;
|
|
// box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05);
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 24rpx;
|
|
|
|
.btn-cont {
|
|
flex: 1;
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
text-align: center;
|
|
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
|
color: #fff;
|
|
border-radius: 44rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
|
transition: all 0.3s ease;
|
|
|
|
&:active {
|
|
transform: scale(0.98);
|
|
opacity: 0.9;
|
|
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
|
}
|
|
|
|
// 清空按钮样式
|
|
&:first-child {
|
|
background: #fff;
|
|
color: #3784fb;
|
|
border: 2rpx solid #3784fb;
|
|
box-shadow: none;
|
|
|
|
&:active {
|
|
background: #f7f8fa;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|