批量退料-二维码添加

This commit is contained in:
bb_pan 2025-07-31 11:03:23 +08:00
parent 2ce3ad0ab3
commit 1a503277e2
2 changed files with 390 additions and 297 deletions

View File

@ -1,277 +1,309 @@
<template>
<view class="ep-picker-box">
<!-- 蒙版区域 开始 -->
<view class="ep-mask-box" v-show="show" @click="show=false"></view>
<!-- 蒙版区域 开始 -->
<view class="ep-picker-box">
<!-- 蒙版区域 开始 -->
<view class="ep-mask-box" v-show="show" @click="show = false"></view>
<!-- 蒙版区域 开始 -->
<!-- 输入框区域 开始 -->
<view class="ep-input-box" @click="openOptions">
<!-- <view style="display: flex;align-items: center;min-height: 36px;font-size: 28rpx;">{{showLabel}}</view> -->
<uni-easyinput v-model="showLabel" maxlength="20" :placeholder="placeholder"
style="width: 100%;font-size: 28rpx;" @input="inputChange" @clear="handleClear" :disabled="disabled"/>
<!-- <image src="@/static/img/select.png" mode="" style="width: 36rpx;height: 36rpx;"></image> -->
</view>
<!-- 输入框区域 结束 -->
<!-- 输入框区域 开始 -->
<view class="ep-input-box" @click="openOptions">
<!-- <view style="display: flex;align-items: center;min-height: 36px;font-size: 28rpx;">{{showLabel}}</view> -->
<uni-easyinput
v-model="showLabel"
maxlength="20"
:placeholder="placeholder"
style="width: 100%; font-size: 28rpx"
@input="inputChange"
@clear="handleClear"
:disabled="disabled"
/>
<!-- <image src="@/static/img/select.png" mode="" style="width: 36rpx;height: 36rpx;"></image> -->
</view>
<!-- 输入框区域 结束 -->
<!-- 弹出的下拉区域 开始 -->
<view v-show="show" class="ep-picker-content-wrap">
<scroll-view class="ep-picker-content" :scroll-y="true">
<!-- 展示下拉项列表 开始 -->
<leoTree :data="selectData" @node-click="nodeClick" :defaultProps="defaultProps"></leoTree>
<!-- 展示下拉项列表 结束 -->
<!-- 弹出的下拉区域 开始 -->
<view v-show="show" class="ep-picker-content-wrap">
<scroll-view class="ep-picker-content" :scroll-y="true">
<!-- 展示下拉项列表 开始 -->
<leoTree :data="selectData" @node-click="nodeClick" :defaultProps="defaultProps"></leoTree>
<!-- 展示下拉项列表 结束 -->
<!-- 下拉列表为空 开始 -->
<view v-if="selectData.length==0" class="option-no-data">无数据...</view>
<!-- 下拉列表为空 结束 -->
</scroll-view>
<text class="triangle"></text>
</view>
<!-- 弹出的下拉区域 结束 -->
</view>
<!-- 下拉列表为空 开始 -->
<view v-if="selectData.length == 0" class="option-no-data">无数据...</view>
<!-- 下拉列表为空 结束 -->
</scroll-view>
<text class="triangle"></text>
</view>
<!-- 弹出的下拉区域 结束 -->
</view>
</template>
<script>
import leoTree from '@/components/tree-select/tree/tree.vue';
export default {
name: "eselect",
components:{
leoTree
},
data() {
return {
show: false,
left: 0,
showLabel:"",
placeholder:"请选择",
selectData:[]
}
},
props: {
value: {
type: [String, Number],
default: ""
},
options: {
type: Array,
default: function() {
return []
}
},
value_key: {
type: String,
default: "value"
},
label_key: {
type: String,
default: "label"
},
defaultProps: {
type: Object,
default: () => {
return {
id: 'id',
children: 'children',
label: 'name'
}
}
},
detailValue: {
type: [String, Number],
default: ""
},
disabled: {
type: Boolean,
default: false
}
},
mounted() {
setTimeout(() => {
// console.log('🚀 ~ created ~ this.detailValue:', this.detailValue)
if (this.detailValue) {
this.showLabel = this.detailValue
} else {
this.showLabel = ''
}
}, 200)
},
methods: {
import leoTree from '@/components/tree-select/tree/tree.vue'
export default {
name: 'eselect',
components: {
leoTree,
},
data() {
return {
show: false,
left: 0,
showLabel: '',
placeholder: '请选择',
selectData: [],
}
},
props: {
value: {
type: [String, Number],
default: '',
},
options: {
type: Array,
default: function () {
return []
},
},
value_key: {
type: String,
default: 'value',
},
label_key: {
type: String,
default: 'label',
},
defaultProps: {
type: Object,
default: () => {
return {
id: 'id',
children: 'children',
label: 'name',
}
},
},
detailValue: {
type: [String, Number],
default: '',
},
disabled: {
type: Boolean,
default: false,
},
},
// value
watch: {
value: {
immediate: true,
handler(newVal) {
this.updateShowLabel(newVal)
},
},
},
mounted() {
setTimeout(() => {
// console.log('🚀 ~ created ~ this.detailValue:', this.detailValue)
if (this.detailValue) {
this.showLabel = this.detailValue
} else {
this.showLabel = ''
}
}, 200)
},
methods: {
updateShowLabel(val) {
const target = this.findNodeById(this.options, val)
this.showLabel = target ? target[this.defaultProps.label] : ''
},
findNodeById(list, id) {
for (const item of list) {
if (item[this.defaultProps.id] === id) {
return item
}
const children = item[this.defaultProps.children]
if (children && children.length) {
const result = this.findNodeById(children, id)
if (result) return result
}
}
return null
},
//
openOptions() {
if (this.disabled) return
if(this.showLabel==""){
this.selectData=this.options
}else{
this.selectData=this.mapTree(this.showLabel,this.options)
}
this.show = true;
},
nodeClick(e){
if(!e.children){
this.show = false;
this.showLabel=e.name;
this.$emit('change', e)
}
},
clearInput(){
this.showLabel="";
this.selectData=this.options;
},
handleClear(){
this.$emit('clear')
},
//
inputChange(e){
// console.log(e)
if(e==""){
this.selectData=this.options
}else{
this.selectData=this.mapTree(e,this.options)
}
// console.log(this.selectData)
},
mapTree(value,arr){
let newarr = [];
arr.forEach(element => {
if (element.name.indexOf(value) > -1) { //
newarr.push(element);
} else {
if (element.children && element.children.length > 0) {
let redata = this.mapTree(value, element.children);
if (redata && redata.length > 0) {
let obj = {
...element,
children: redata,
expanded: true //
};
newarr.push(obj);
}
}
}
});
return newarr;
}
},
}
//
openOptions() {
if (this.disabled) return
if (this.showLabel == '') {
this.selectData = this.options
} else {
this.selectData = this.mapTree(this.showLabel, this.options)
}
this.show = true
},
nodeClick(e) {
if (!e.children) {
this.show = false
this.showLabel = e.name
this.$emit('change', e)
}
},
clearInput() {
this.showLabel = ''
this.selectData = this.options
},
handleClear() {
this.$emit('clear')
},
//
inputChange(e) {
// console.log(e)
if (e == '') {
this.selectData = this.options
} else {
this.selectData = this.mapTree(e, this.options)
}
// console.log(this.selectData)
},
mapTree(value, arr) {
let newarr = []
arr.forEach((element) => {
if (element.name.indexOf(value) > -1) {
//
newarr.push(element)
} else {
if (element.children && element.children.length > 0) {
let redata = this.mapTree(value, element.children)
if (redata && redata.length > 0) {
let obj = {
...element,
children: redata,
expanded: true, //
}
newarr.push(obj)
}
}
}
})
return newarr
},
},
}
</script>
<style scoped>
/* 引入字体图标 */
/* @import './iconfont.css'; */
.ep-picker-box {
/* width:100%; */
/* box-sizing: border-box; */
position: relative;
display: flex;
align-items: center;
font-size: 20rpx;
color: #0F274B;
width: 130rpx;
height: 48rpx;
border-radius: 12rpx 12rpx 12rpx 12rpx;
/* border: 2rpx solid #3888FF; */
background:#fff;
}
/* 引入字体图标 */
/* @import './iconfont.css'; */
.ep-picker-box {
/* width:100%; */
/* box-sizing: border-box; */
position: relative;
display: flex;
align-items: center;
font-size: 20rpx;
color: #0f274b;
width: 130rpx;
height: 48rpx;
border-radius: 12rpx 12rpx 12rpx 12rpx;
/* border: 2rpx solid #3888FF; */
background: #fff;
}
.ep-mask-box {
position: fixed;
z-index: 99999;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: none;
}
.ep-mask-box {
position: fixed;
z-index: 99999;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: none;
}
.ep-input-box {
border-radius: 4px;
position: relative;
cursor: pointer;
width: 100%;
height: 100%;
display:flex;
justify-content: space-between;
align-items: center;
overflow: auto;
text-overflow: ellipsis;
}
.ep-input-box {
border-radius: 4px;
position: relative;
cursor: pointer;
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
align-items: center;
overflow: auto;
text-overflow: ellipsis;
}
/* 展开收起箭头样式 */
.ep-input-box .iconfont {
position: absolute;
top: 50%;
right: 5px;
font-size: 20px;
transform: translateY(-50%);
color: #B8B8B8;
}
/* 展开收起箭头样式 */
.ep-input-box .iconfont {
position: absolute;
top: 50%;
right: 5px;
font-size: 20px;
transform: translateY(-50%);
color: #b8b8b8;
}
/* 下拉容器样式 外层 */
.ep-picker-content-wrap {
max-height: 48vh;
width: 100%;
position: absolute;
top: 88rpx;
left: 0;
z-index: 999999;
padding-top: 6px;
}
/* 下拉容器样式 外层 */
.ep-picker-content-wrap {
max-height: 48vh;
width: 100%;
position: absolute;
top: 88rpx;
left: 0;
z-index: 999999;
padding-top: 6px;
}
/* 下拉容器样式 内层 */
.ep-picker-content-wrap .ep-picker-content {
background-color: #fff;
color: #999;
padding: 3px 0;
box-shadow: 0 0 20rpx 5rpx rgb(0 0 0 / 30%);
border-radius: 5px;
max-height: 46vh;
}
/* 下拉容器样式 内层 */
.ep-picker-content-wrap .ep-picker-content {
background-color: #fff;
color: #999;
padding: 3px 0;
box-shadow: 0 0 20rpx 5rpx rgb(0 0 0 / 30%);
border-radius: 5px;
max-height: 46vh;
}
/* 下拉项通用样式 */
.ep-picker-content-wrap .ep-picker-content .option-item {
padding: 20rpx 12rpx 14rpx;
font-size: 20rpx;
cursor: pointer;
border-bottom: 1rpx solid #DFDDDD;
word-break: break-all;
}
/* 下拉项通用样式 */
.ep-picker-content-wrap .ep-picker-content .option-item {
padding: 20rpx 12rpx 14rpx;
font-size: 20rpx;
cursor: pointer;
border-bottom: 1rpx solid #dfdddd;
word-break: break-all;
}
.ep-picker-content-wrap .ep-picker-content .option-item:last-child {
border-bottom: none;
}
.ep-picker-content-wrap .ep-picker-content .option-item:last-child {
border-bottom: none;
}
/* 无下拉项数据时样式 */
.ep-picker-content-wrap .ep-picker-content .option-no-data {
padding: 8px 18px;
cursor: text;
color: #999;
text-align: center;
}
/* 无下拉项数据时样式 */
.ep-picker-content-wrap .ep-picker-content .option-no-data {
padding: 8px 18px;
cursor: text;
color: #999;
text-align: center;
}
/* 鼠标移入下拉项样式 */
.ep-picker-content-wrap .ep-picker-content .option-item:hover {
background-color: #f5f7fa;
}
/* 鼠标移入下拉项样式 */
.ep-picker-content-wrap .ep-picker-content .option-item:hover {
background-color: #f5f7fa;
}
/* 已选中的下拉项样式 */
.ep-picker-content-wrap .ep-picker-content .option-item.active {
/* color: #007AFF; */
}
/* 已选中的下拉项样式 */
.ep-picker-content-wrap .ep-picker-content .option-item.active {
/* color: #007AFF; */
}
/* 下拉容器指示箭头样式 */
.ep-picker-content-wrap .triangle {
width: 0;
height: 0;
border-top: 6px solid rgba(0, 0, 0, 0);
border-right: 6px solid rgba(0, 0, 0, 0);
border-bottom: 6px solid #fff;
border-left: 6px solid rgba(0, 0, 0, 0);
position: absolute;
top: -6px;
left: 50%;
transform: translateX(-50%);
box-sizing: content-box;
}
/* 下拉容器指示箭头样式 */
.ep-picker-content-wrap .triangle {
width: 0;
height: 0;
border-top: 6px solid rgba(0, 0, 0, 0);
border-right: 6px solid rgba(0, 0, 0, 0);
border-bottom: 6px solid #fff;
border-left: 6px solid rgba(0, 0, 0, 0);
position: absolute;
top: -6px;
left: 50%;
transform: translateX(-50%);
box-sizing: content-box;
}
</style>

View File

@ -140,10 +140,10 @@
</uni-col>
</uni-row> -->
<uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
<uni-col :span="6">物资类型</uni-col>
<uni-col :span="6">规格型号</uni-col>
<uni-col :span="18">
<eselect
v-model="selectTypeId"
:value="selectTypeId"
style="width: 100%; height: 90rpx; margin: 10px 0"
ref="treeSelect"
:options="typeOptions"
@ -151,6 +151,12 @@
></eselect>
</uni-col>
</uni-row>
<uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
<uni-col :span="6">物资类型</uni-col>
<uni-col :span="16">
{{ typeName }}
</uni-col>
</uni-row>
<uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
<uni-col :span="6">外观判定</uni-col>
@ -198,9 +204,10 @@
</uni-col>
</uni-row>
<scroll-view
v-if="typeList.length > 0"
scroll-y
@scrolltolower="onScrollTolower"
style="flex: 1; overflow: auto; min-height: 160px"
style="flex: 1; overflow: auto"
>
<div class="card" style="margin-top: 10px">
<uni-row
@ -362,9 +369,20 @@ const getCodeList = async () => {
}
})
typeList.value.forEach((item) => {
item.checked = selectCodeList.value.some((selected) => selected.maCode === item.maCode)
})
const combinedList = [...selectCodeList.value, ...typeList.value]
// maCode
const seen = new Set()
const uniqueList = []
for (const item of combinedList) {
if (!seen.has(item.maCode)) {
seen.add(item.maCode)
uniqueList.push(item)
}
}
// typeList
typeList.value = uniqueList
console.log('🚀 ~ getCodeList ~ typeList.value:', typeList.value)
} catch (error) {
@ -377,10 +395,13 @@ const getCodeList = async () => {
//
const changeType = (e) => {
selectCodeList.value = []
console.log('🚀 ~ changeType ~ e:', e)
selectTypeId.value = e.typeId
console.log('🚀 ~ changeType ~ :', selectTypeId.value)
if (selectTypeId.value != e.typeId) {
selectCodeList.value = []
console.log('🚀 ~ changeType ~ e:', e)
typeName.value = e.materialName
selectTypeId.value = e.typeId
console.log('🚀 ~ changeType ~ :', selectTypeId.value)
}
getCodeList()
}
@ -396,7 +417,7 @@ const handleItemChecked = (item) => {
console.log('🚀 ~ handleItemChecked ~ item:', item)
item.checked = !item.checked
if (item.checked) {
selectCodeList.value.push(item)
selectCodeList.value.unshift(item)
} else {
selectCodeList.value = selectCodeList.value.filter((el) => el.maCode !== item.maCode)
}
@ -481,6 +502,8 @@ const getMaInfo = () => {
const qrCode = ref('') //
//
const scanStart = async () => {
qrCode.value = '201909-00100'
getMaInfoScan()
qrCode.value = ''
if (scanQrCodeRef.value) {
scanQrCodeRef.value.scanQrCode()
@ -528,16 +551,57 @@ const getMaInfoScan = () => {
}
console.log('xxxxxxxxxxxxxxxx', res)
if (res.code == 200) {
if (selectTypeId.value && selectTypeId.value != Number(res.data[0].typeId)) {
//
uni.showModal({
title: '提示',
content: '请添加同一类型的设备',
showCancel: false,
confirmText: '关闭',
})
return
}
console.log(res)
console.log(res.data[0])
maCode.value = res.data[0].maCode
console.log('333333333333', maCode.value)
console.log('codeList:', JSON.stringify(codeList.value))
// maCode.value = res.data[0].maCode
typeName.value = res.data[0].typeName
materialName.value = res.data[0].typeModelName
maStatusName.value = res.data[0].maStatusName
maId.value = res.data[0].maId
typeId.value = res.data[0].typeId
// maStatusName.value = res.data[0].maStatusName
// maId.value = res.data[0].maId
selectTypeId.value = Number(res.data[0].typeId)
console.log('🚀 ~ getMaInfoScan ~ selectTypeId.value:', selectTypeId.value)
if (typeList.value.some((item) => item.maId == Number(res.data[0].maId))) {
//
typeList.value.forEach((item) => {
if (item.maId == res.data[0].maId) {
item.checked = true
}
})
if (!selectCodeList.value.some((item) => item.maId === res.data[0].maId)) {
selectCodeList.value.unshift({
...res.data[0],
checked: true,
})
uni.showToast({ title: '添加成功', icon: 'none' })
} else {
uni.showToast({ title: '当前设备已添加', icon: 'none' })
}
} else {
typeList.value.unshift({
...res.data[0],
checked: true,
})
if (!selectCodeList.value.some((item) => item.maId === res.data[0].maId)) {
selectCodeList.value.unshift({
...res.data[0],
checked: true,
})
}
uni.showToast({ title: '添加成功', icon: 'none' })
}
isAllChecked()
flag.value = true
} else {
uni.showModal({
@ -545,11 +609,6 @@ const getMaInfoScan = () => {
content: res.msg,
showCancel: false, //
confirmText: '关闭',
success: (res) => {
// if (res.confirm) {
// console.log('')
// }
},
})
}
},
@ -664,7 +723,9 @@ const submitCode = () => {
imgList.value = []
selectCodeList.value = []
// getMaCodeList()
getCodeList()
if (selectTypeId.value) {
getCodeList()
}
// uni.navigateBack({
// delta: 1 //
// });
@ -888,7 +949,7 @@ onLoad((options) => {
background-color: #f7f8fa;
display: flex;
flex-direction: column;
min-height: 100vh; //
height: 100vh; //
//
.card {