Browse Source

feat: NZKO-696, NZKO-697 出库信息带出备件库位信息,PDA备件归还 归还人员选择增加模糊搜索

master
ljlong_2630 3 months ago
parent
commit
960154e977
  1. 236
      src/components/user/userSelect.vue
  2. 20
      src/pages/outLocation/addForm.vue
  3. 72
      src/pages/sparePartsReturn/addForm.vue

236
src/components/user/userSelect.vue

@ -0,0 +1,236 @@
<template>
<!-- 选择人员 -->
<u-popup v-model="props.isShowSelectPerson" mode="center" border-radius="14">
<view class="popup-title">选择人员</view>
<view class="popup">
<u-search placeholder="搜索" v-model="form1.searchName" @change="searchPerson"></u-search>
<view class="list">
<view class="person" v-for="(person, index) in singleColumnList" :key="index" @click="choosePerson(person)">
<u-checkbox v-model="person.checked" shape="circle" style="margin-top: 8rpx;"></u-checkbox>
<view class="right">
<view class="person-nickname">
<span>{{person.nickname}}</span>
</view>
<!-- <view class="person-name">
登录名: <span>{{person.name}}</span>
</view> -->
<!-- <view class="person-id">
ID: <span>{{person.id}}</span>
</view> -->
</view>
</view>
</view>
</view>
<view class="popup-footer">
<view @click="choosePerson1(0)">取消</view>
<view class="sure" @click="choosePerson1(1)">确认</view>
</view>
</u-popup>
</template>
<script setup lang="ts">
import {
ref,
defineProps,
defineEmits,
getCurrentInstance,
watch
} from 'vue'
import {
onLoad,
} from '@dcloudio/uni-app'
const props = defineProps({
isShowSelectPerson: {
type: Boolean,
default: () => { return false },
require: true
},
singleColumnList: {
type: Array,
default: () => { return [] },
require: false
}
});
// isShowSelectPerson
watch(() => props.isShowSelectPerson, (newValue, oldValue) => {
if (newValue) {
console.log('props.isShowSelectPerson', props.isShowSelectPerson);
form1.value.searchName = ""
form1.value.temporarilyId = null
form1.value.temporarilyNickname = null
form1.value.temporarilyName = null
}
});
const { proxy } = getCurrentInstance()
const personList = ref([])
const type = ref('')
const isShowSelectPerson = ref(false);
const selectVal = ref(null);
const emits = defineEmits(['searchPerson', 'choosePerson']);
const form1 = ref({
id: "",
nickname: "",
name: "",
temporarilyId: "", // ID
temporarilyNickname: "", //
temporarilyName: "", //
searchName: "", //
})
onLoad((option) => {
if (option.type) type.value = option.type;
if (option.type) isShowSelectPerson.value = option.isShowSelectPerson; //
if (option.selectVal) selectVal.value = option.selectVal; //
})
//
function choosePerson1(type) {
if (type == 1) {
form1.value.id = form1.value.temporarilyId
form1.value.nickname = form1.value.temporarilyNickname
form1.value.name = form1.value.temporarilyName
}
emits('choosePerson', type, form1);
}
function searchPerson() {
emits('searchPerson', form1.value.searchName);
}
function choosePerson(person) {
console.log('props.isShowSelectPerson', props.isShowSelectPerson);
console.log('props.singleColumnList', props.singleColumnList);
let arr = props.singleColumnList.filter(cur => cur.id != person.id)
arr.forEach(person => {
person.checked = false
})
person.checked = !person.checked
let arr1 = props.singleColumnList.filter(cur => cur.id == person.id)
form1.value.temporarilyId = arr1[0].id;
form1.value.temporarilyNickname = arr1[0].nickname;
form1.value.temporarilyName = arr1[0].name;
}
</script>
<style lang="scss" scoped>
.add-form-container {
min-height: calc(100vh - 140rpx);
background: white;
padding: 0px 30rpx 140rpx;
}
.footer {
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
z-index: 22;
}
.btns {
display: flex;
button {
flex: 1;
}
.sure {
background: #409eff;
color: white;
border-radius: 0px;
&::after {
border: 1px solid #409eff;
border-radius: 0px;
}
}
.reset {
background: #F5F5F5;
border-radius: 0px;
&::after {
border-radius: 0px;
}
}
}
.right-button {
background: #409eff;
color: white;
padding: 0rpx 30rpx;
border-radius: 16rpx;
text-align: center;
font-size: 28rpx;
}
.select {
display: flex;
align-items: center;
height: 72rpx;
width: 100%;
.input {
flex: 1;
font-size: 28rpx;
color: #000000;
}
.placeholder {
flex: 1;
font-size: 28rpx;
color: rgb(192, 196, 204);
}
}
.title {
padding: 32rpx 0px;
position: relative;
span {
position: absolute;
left: -16rpx;
color: #fa3534;
padding-top: 6rpx;
}
}
.list {
.person {
display: flex;
margin-bottom: 20rpx;
.person-box {
background: #F5F5F5;
border-radius: 12rpx;
flex: 1;
width: 0rpx;
}
.person-title {
padding: 20rpx 30rpx;
border-bottom: 1px solid #e4e4e4;
.title-txt {
color: #409eff;
font-size: 30rpx;
font-weight: bold;
}
}
.dec {
color: #9c9c9c;
padding: 20rpx 30rpx 20rpx;
}
}
}
.add-btn {
display: flex;
justify-content: flex-start;
align-items: center;
}
.popup-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
color: #409eff;
padding: 30rpx 30rpx 0px;
}
.popup {
width: 600rpx;
padding: 30rpx 60rpx 30rpx;
}
.popup-footer {
display: flex;
border-top: 1px solid #e4e4e4;
view {
line-height: 100rpx;
flex: 1;
text-align: center;
&.sure {
color: #409eff;
}
}
}
::v-deep .u-checkbox-group {
display: grid !important;
}
</style>

20
src/pages/outLocation/addForm.vue

@ -40,6 +40,26 @@
申请数量:{{item.qty}} 申请数量:{{item.qty}}
</view> </view>
</u-col> </u-col>
<u-col :span="24" v-if="item.outSite">
<view class="dec">
账外库位:{{item.outSite}}
</view>
</u-col>
<u-col :span="24" v-if="item.outSite">
<view class="dec">
账外数量:{{item.outQty}}
</view>
</u-col>
<u-col :span="24" v-if="item.inSite">
<view class="dec">
账内库位:{{item.inSite}}
</view>
</u-col>
<u-col :span="24" v-if="item.inSite">
<view class="dec">
账内数量:{{item.inQty}}
</view>
</u-col>
</u-row> </u-row>
</view> </view>
</view> </view>

72
src/pages/sparePartsReturn/addForm.vue

@ -7,9 +7,9 @@
</u-form-item> --> </u-form-item> -->
<u-form-item label="归还人员" prop="reverterName" required> <u-form-item label="归还人员" prop="reverterName" required>
<view class="select" @click="openSingleColumn('reverterId',form.reverterId,reverterUser)"> <view class="select" @click="openSingleNewColumn('reverterId',form.reverterId,reverterUser)">
<view class="input" v-if='form.reverterId'> <view class="input" v-if='form.reverterId'>
{{selectFormat(form.reverterId,reverterUser)}} {{form.nickname}}
</view> </view>
<view class="placeholder" v-else> <view class="placeholder" v-else>
{{`请选择归还人员`}} {{`请选择归还人员`}}
@ -89,6 +89,12 @@
</u-popup> </u-popup>
<u-select v-model="singleColumnShow" mode="single-column" :default-value='singleColumnDefaultValue' <u-select v-model="singleColumnShow" mode="single-column" :default-value='singleColumnDefaultValue'
:list="singleColumnList" @confirm="chooseSingleColumn"></u-select> :list="singleColumnList" @confirm="chooseSingleColumn"></u-select>
<SelectUserList
:isShowSelectPerson="isShowSelectPerson"
:singleColumnList="singleColumnList"
@searchPerson="searchPerson"
@choosePerson="choosePerson"
/>
</view> </view>
</template> </template>
@ -104,6 +110,7 @@
import * as sparePartsReturnApi from "@/api/sparePartsReturn" import * as sparePartsReturnApi from "@/api/sparePartsReturn"
import * as sparePartsApi from "@/api/spareParts" import * as sparePartsApi from "@/api/spareParts"
import * as locationApi from "@/api/location" import * as locationApi from "@/api/location"
import SelectUserList from "../../components/user/userSelect.vue"
const { proxy } = getCurrentInstance() const { proxy } = getCurrentInstance()
const loading = ref(false) const loading = ref(false)
@ -129,7 +136,7 @@ const singleColumnShow = ref(false)
const locationList = ref([])// const locationList = ref([])//
const locationItem = ref('')// const locationItem = ref('')//
const isFocus = ref(false) const isFocus = ref(false)
const isShowSelectPerson = ref(false)
const choosesingleColumnItem = ref() const choosesingleColumnItem = ref()
const itemNumber = ref() const itemNumber = ref()
const msg = ref() const msg = ref()
@ -178,10 +185,10 @@ const singleColumnShow = ref(false)
} }
} }
function selectFormat(val, array) { // function selectFormat(val, array) {
let str = array.filter(item => item.value == val)[0].label // let str = array.filter(item => item.value == val)[0].label
return str // return str
} // }
// //
function openSingleColumn(fieldName, val, list) { function openSingleColumn(fieldName, val, list) {
singleColumnList.value = list singleColumnList.value = list
@ -218,7 +225,7 @@ const singleColumnShow = ref(false)
itemNumber: "", itemNumber: "",
itemName: '', itemName: '',
locationNumber: '', locationNumber: '',
qty: '' qty: '',
} }
isPopupShow.value = true isPopupShow.value = true
isShow.value= false isShow.value= false
@ -357,6 +364,55 @@ const singleColumnShow = ref(false)
function handelScanMsg1() { function handelScanMsg1() {
getSparePartsInfo() getSparePartsInfo()
} }
//
function openSingleNewColumn(fieldName, val, list) {
singleColumnList.value = list
field.value = fieldName
if (val) {
singleColumnDefaultValue.value = [list.findIndex(item => item.value == val)]
} else {
singleColumnDefaultValue.value = []
}
isShowSelectPerson.value = true;
singleColumnList.value = list
}
async function searchPerson(name){
await getUserList(name);
}
async function choosePerson(type,forms){
if(!forms.value.id&&type==1){
proxy.$modal.showToast('请选择用户')
return
}
if(type==1){
form.value.nickname = forms.value.temporarilyNickname
form.value.name =forms.value.temporarilyName
form.value.reverterId = forms.value.temporarilyId
}
await getUserList(null);
isShowSelectPerson.value = false;
}
//
async function getUserList(name) {
await userApi.getReverterUser().then(res => {
// null
let filteredData = name ? res.data.filter(item => item.nickname.includes(name)) : res.data;
//
filteredData.map(item => {
item.value = item.id;
item.label = item.nickname;
});
reverterUser.value = filteredData;
singleColumnList.value = reverterUser.value;
}).catch(() => {});
}
onLoad(async(option) => { onLoad(async(option) => {
getReverterUser() getReverterUser()
}) })

Loading…
Cancel
Save