批量退料-二维码添加
This commit is contained in:
parent
2ce3ad0ab3
commit
1a503277e2
|
|
@ -1,14 +1,21 @@
|
|||
<template>
|
||||
<view class="ep-picker-box">
|
||||
<!-- 蒙版区域 开始 -->
|
||||
<view class="ep-mask-box" v-show="show" @click="show=false"></view>
|
||||
<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"/>
|
||||
<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>
|
||||
<!-- 输入框区域 结束 -->
|
||||
|
|
@ -21,7 +28,7 @@
|
|||
<!-- 展示下拉项列表 结束 -->
|
||||
|
||||
<!-- 下拉列表为空 开始 -->
|
||||
<view v-if="selectData.length==0" class="option-no-data">无数据...</view>
|
||||
<view v-if="selectData.length == 0" class="option-no-data">无数据...</view>
|
||||
<!-- 下拉列表为空 结束 -->
|
||||
</scroll-view>
|
||||
<text class="triangle"></text>
|
||||
|
|
@ -31,39 +38,39 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import leoTree from '@/components/tree-select/tree/tree.vue';
|
||||
export default {
|
||||
name: "eselect",
|
||||
components:{
|
||||
leoTree
|
||||
import leoTree from '@/components/tree-select/tree/tree.vue'
|
||||
export default {
|
||||
name: 'eselect',
|
||||
components: {
|
||||
leoTree,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
left: 0,
|
||||
showLabel:"",
|
||||
placeholder:"请选择",
|
||||
selectData:[]
|
||||
showLabel: '',
|
||||
placeholder: '请选择',
|
||||
selectData: [],
|
||||
}
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: ""
|
||||
default: '',
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
default: function() {
|
||||
default: function () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
},
|
||||
value_key: {
|
||||
type: String,
|
||||
default: "value"
|
||||
default: 'value',
|
||||
},
|
||||
label_key: {
|
||||
type: String,
|
||||
default: "label"
|
||||
default: 'label',
|
||||
},
|
||||
defaultProps: {
|
||||
type: Object,
|
||||
|
|
@ -71,18 +78,27 @@
|
|||
return {
|
||||
id: 'id',
|
||||
children: 'children',
|
||||
label: 'name'
|
||||
}
|
||||
label: 'name',
|
||||
}
|
||||
},
|
||||
},
|
||||
detailValue: {
|
||||
type: [String, Number],
|
||||
default: ""
|
||||
default: '',
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
// 监听 value 的变化 立即监听
|
||||
watch: {
|
||||
value: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
this.updateShowLabel(newVal)
|
||||
},
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
|
|
@ -95,85 +111,103 @@
|
|||
}, 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)
|
||||
if (this.showLabel == '') {
|
||||
this.selectData = this.options
|
||||
} else {
|
||||
this.selectData = this.mapTree(this.showLabel, this.options)
|
||||
}
|
||||
this.show = true;
|
||||
this.show = true
|
||||
},
|
||||
nodeClick(e){
|
||||
if(!e.children){
|
||||
this.show = false;
|
||||
this.showLabel=e.name;
|
||||
nodeClick(e) {
|
||||
if (!e.children) {
|
||||
this.show = false
|
||||
this.showLabel = e.name
|
||||
this.$emit('change', e)
|
||||
}
|
||||
},
|
||||
clearInput(){
|
||||
this.showLabel="";
|
||||
this.selectData=this.options;
|
||||
clearInput() {
|
||||
this.showLabel = ''
|
||||
this.selectData = this.options
|
||||
},
|
||||
handleClear(){
|
||||
handleClear() {
|
||||
this.$emit('clear')
|
||||
},
|
||||
//输入框查询
|
||||
inputChange(e){
|
||||
inputChange(e) {
|
||||
// console.log(e)
|
||||
if(e==""){
|
||||
this.selectData=this.options
|
||||
}else{
|
||||
this.selectData=this.mapTree(e,this.options)
|
||||
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);
|
||||
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);
|
||||
let redata = this.mapTree(value, element.children)
|
||||
if (redata && redata.length > 0) {
|
||||
let obj = {
|
||||
...element,
|
||||
children: redata,
|
||||
expanded: true // 展开子节点
|
||||
};
|
||||
newarr.push(obj);
|
||||
expanded: true, // 展开子节点
|
||||
}
|
||||
newarr.push(obj)
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
return newarr;
|
||||
}
|
||||
})
|
||||
return newarr
|
||||
},
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 引入字体图标 */
|
||||
/* @import './iconfont.css'; */
|
||||
.ep-picker-box {
|
||||
/* 引入字体图标 */
|
||||
/* @import './iconfont.css'; */
|
||||
.ep-picker-box {
|
||||
/* width:100%; */
|
||||
/* box-sizing: border-box; */
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 20rpx;
|
||||
color: #0F274B;
|
||||
color: #0f274b;
|
||||
width: 130rpx;
|
||||
height: 48rpx;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
/* border: 2rpx solid #3888FF; */
|
||||
background:#fff;
|
||||
}
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.ep-mask-box {
|
||||
.ep-mask-box {
|
||||
position: fixed;
|
||||
z-index: 99999;
|
||||
top: 0;
|
||||
|
|
@ -181,33 +215,33 @@
|
|||
left: 0;
|
||||
bottom: 0;
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ep-input-box {
|
||||
.ep-input-box {
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display:flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
overflow: auto;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
/* 展开收起箭头样式 */
|
||||
.ep-input-box .iconfont {
|
||||
/* 展开收起箭头样式 */
|
||||
.ep-input-box .iconfont {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 5px;
|
||||
font-size: 20px;
|
||||
transform: translateY(-50%);
|
||||
color: #B8B8B8;
|
||||
}
|
||||
color: #b8b8b8;
|
||||
}
|
||||
|
||||
/* 下拉容器样式 外层 */
|
||||
.ep-picker-content-wrap {
|
||||
/* 下拉容器样式 外层 */
|
||||
.ep-picker-content-wrap {
|
||||
max-height: 48vh;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
|
|
@ -215,53 +249,51 @@
|
|||
left: 0;
|
||||
z-index: 999999;
|
||||
padding-top: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 下拉容器样式 内层 */
|
||||
.ep-picker-content-wrap .ep-picker-content {
|
||||
/* 下拉容器样式 内层 */
|
||||
.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 {
|
||||
/* 下拉项通用样式 */
|
||||
.ep-picker-content-wrap .ep-picker-content .option-item {
|
||||
padding: 20rpx 12rpx 14rpx;
|
||||
font-size: 20rpx;
|
||||
cursor: pointer;
|
||||
border-bottom: 1rpx solid #DFDDDD;
|
||||
border-bottom: 1rpx solid #dfdddd;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.ep-picker-content-wrap .ep-picker-content .option-item:last-child {
|
||||
.ep-picker-content-wrap .ep-picker-content .option-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* 无下拉项数据时样式 */
|
||||
.ep-picker-content-wrap .ep-picker-content .option-no-data {
|
||||
/* 无下拉项数据时样式 */
|
||||
.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 {
|
||||
/* 鼠标移入下拉项样式 */
|
||||
.ep-picker-content-wrap .ep-picker-content .option-item:hover {
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
}
|
||||
|
||||
/* 已选中的下拉项样式 */
|
||||
.ep-picker-content-wrap .ep-picker-content .option-item.active {
|
||||
/* 已选中的下拉项样式 */
|
||||
.ep-picker-content-wrap .ep-picker-content .option-item.active {
|
||||
/* color: #007AFF; */
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 下拉容器指示箭头样式 */
|
||||
.ep-picker-content-wrap .triangle {
|
||||
/* 下拉容器指示箭头样式 */
|
||||
.ep-picker-content-wrap .triangle {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 6px solid rgba(0, 0, 0, 0);
|
||||
|
|
@ -273,5 +305,5 @@
|
|||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
box-sizing: content-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -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) => {
|
||||
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()
|
||||
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 {
|
||||
|
|
|
|||
Loading…
Reference in New Issue