定损、维修配件类型展开全部

This commit is contained in:
hayu 2026-01-21 17:21:39 +08:00
parent 5c5b7457cf
commit 4970361442
7 changed files with 398 additions and 7 deletions

View File

@ -138,7 +138,7 @@ import {
saveLossAssessmentRow
} from '@/services/repair/equipAssessment.js'
import { baseURL } from '@/utils/http'
import treeSelect from '../tree-select/tselectTwo.vue'
import treeSelect from '../tree-select/tselectTwo2.vue'
import { onLoad } from '@dcloudio/uni-app'
import PreviewImg from '@/components/PreviewImg/index.vue'
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'

View File

@ -220,7 +220,7 @@ import {
saveLossAssessmentRow
} from '@/services/repair/equipAssessment.js'
import { baseURL } from '@/utils/http'
import treeSelect from '../tree-select/tselectTwo.vue';
import treeSelect from '../tree-select/tselectTwo2.vue';
import { onLoad } from '@dcloudio/uni-app'
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'
import PreviewImg from '@/components/PreviewImg/index.vue'

View File

@ -139,7 +139,7 @@ import {
getPartItemApi,
} from '@/services/repair/repair.js'
import { baseURL } from '@/utils/http'
import treeSelect from '../tree-select/tselectTwo.vue'
import treeSelect from '../tree-select/tselectTwo2.vue'
import { onLoad,onShow } from '@dcloudio/uni-app'
import PreviewImg from '@/components/PreviewImg/index.vue'
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'

View File

@ -280,7 +280,7 @@ import {
getPartItemApi,
} from '@/services/repair/repair.js'
import { baseURL } from '@/utils/http'
import treeSelect from '../tree-select/tselectTwo.vue'
import treeSelect from '../tree-select/tselectTwo2.vue'
import { onLoad,onShow } from '@dcloudio/uni-app'
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'
import PreviewImg from '@/components/PreviewImg/index.vue'

View File

@ -277,7 +277,7 @@ import {
saveRepairRow,
getScrapReasonList
} from '@/services/repair/repair.js'
import treeSelect from '../tree-select/tselectTwo.vue';
import treeSelect from '../tree-select/tselectTwo2.vue';
import {onLoad, onShow} from '@dcloudio/uni-app'
import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'
import PreviewImg from '@/components/PreviewImg/index.vue'

View File

@ -0,0 +1,95 @@
<template>
<view class="tree-container">
<view v-for="(node, index) in data" :key="index" class="tree-node">
<!-- 修改添加库存数显示 -->
<view class="node-content" @click="handleNodeClick(node)">
<text class="node-label">{{ node[defaultProps.label] }}</text>
<!-- 关键只在最后一级节点显示库存数 -->
<text v-if="!node[defaultProps.children] && node.storageNum" class="storage-num">
{{ node.storageNum }}
</text>
</view>
<!-- 始终显示子节点 -->
<view class="children-container">
<leo-tree :data="node[defaultProps.children]" :defaultProps="defaultProps" @node-click="handleNodeClick"></leo-tree>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'leoTree',
props: {
data: {
type: Array,
default: () => []
},
defaultProps: {
type: Object,
default: () => ({
id: 'id',
children: 'children',
label: 'label'
})
},
//
defaultExpandAll: {
type: Boolean,
default: true
}
},
methods: {
handleNodeClick(node) {
this.$emit('node-click', node)
}
}
}
</script>
<style scoped>
.tree-container {
width: 100%;
}
.tree-node {
padding: 4rpx 0;
}
.node-content {
display: flex;
align-items: center;
padding: 12rpx 16rpx;
cursor: pointer;
font-size: 28rpx;
/* 添加:让标签和库存数在一行显示 */
justify-content: space-between;
}
.node-content:hover {
background-color: #f5f7fa;
}
.node-label {
flex: 1;
color: #333;
}
/* 新增:库存数样式 */
.storage-num {
font-size: 28rpx;
color: #666;
margin-left: 10rpx;
}
/* 移除三角图标样式 */
.arrow-icon {
display: none !important;
}
.children-container {
padding-left: 32rpx;
border-left: 1rpx solid #e8e8e8;
margin-left: 16rpx;
}
</style>

View File

@ -0,0 +1,296 @@
<template>
<view class="ep-picker-box">
<!-- 蒙版区域 开始 -->
<view class="ep-mask-box" v-show="show" @click="show=false"></view>
<!-- 蒙版区域 开始 -->
<!-- 输入框区域 开始 -->
<view class="ep-input-box" @click="openOptions">
<uni-easyinput v-model="showLabel" maxlength="20" :placeholder="placeholder"
style="width: 100%;font-size: 28rpx;" @input="inputChange" @clear="handleClear"/>
</view>
<!-- 输入框区域 结束 -->
<!-- 弹出的下拉区域 开始 -->
<view v-show="show" class="ep-picker-content-wrap">
<scroll-view class="ep-picker-content" :scroll-y="true">
<!-- 展示下拉项列表 开始 -->
<!-- 修改1添加 default-expand-all 属性让所有节点默认展开 -->
<leoTree :data="selectData" @node-click="nodeClick" :defaultProps="defaultProps" default-expand-all></leoTree>
<!-- 展示下拉项列表 结束 -->
<!-- 下拉列表为空 开始 -->
<view v-if="selectData.length==0" class="option-no-data">无数据...</view>
<!-- 下拉列表为空 结束 -->
</scroll-view>
<text class="triangle"></text>
</view>
<!-- 弹出的下拉区域 结束 -->
</view>
</template>
<script>
import leoTree from './tree/tree2.vue';
export default {
name: "treeSelect",
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'
}
}
},
index: {
type: [String, Number],
default: ""
}
},
methods: {
//
getNodePath(node, options) {
for (const option of options) {
if (option[this.defaultProps.id] === node[this.defaultProps.id]) {
return [option[this.defaultProps.label]];
}
if (option.children && option.children.length > 0) {
const path = this.getNodePath(node, option.children);
if (path) {
return [option[this.defaultProps.label], ...path];
}
}
}
return null;
},
//
findNodeById(id, options) {
for (const option of options) {
if (option[this.defaultProps.id] === id) {
return option;
}
if (option.children && option.children.length > 0) {
const node = this.findNodeById(id, option.children);
if (node) {
return node;
}
}
}
return null;
},
//
setSelectedValue(id) {
const node = this.findNodeById(id, this.options);
if (node) {
//
const path = this.getNodePath(node, this.options);
if (path) {
//
this.showLabel = path.join('/');
} else {
this.showLabel = node[this.defaultProps.label];
}
}
},
//
openOptions() {
// 2
this.selectData = this.options;
this.show = true;
},
nodeClick(e){
if(!e.children){
this.show = false;
//
const path = this.getNodePath(e, this.options);
if (path) {
//
this.showLabel = path.join('/');
} else {
this.showLabel = e[this.defaultProps.label];
}
this.$emit('change', e,this.index)
}
},
clearInput(){
this.showLabel="";
this.selectData=this.options;
},
handleClear(){
this.$emit('clear',this.index)
},
//
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){
console.log("sssssss")
let newarr = [];
arr.forEach(element => {
if (element.label.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
};
newarr.push(obj);
}
}
}
});
return newarr;
}
},
}
</script>
<style scoped>
/* 引入字体图标 */
/* @import './iconfont.css'; */
.ep-picker-box {
position: relative;
display: flex;
align-items: center;
font-size: 20rpx;
color: #0F274B;
width: 130rpx;
height: 48rpx;
border-radius: 12rpx 12rpx 12rpx 12rpx;
background:#fff;
}
.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-picker-content-wrap {
max-height: 30vh;
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: 181px;
}
/* 下拉项通用样式 */
.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-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.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;
}
</style>