定损、维修配件类型展开全部
This commit is contained in:
parent
5c5b7457cf
commit
4970361442
|
|
@ -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'
|
||||
|
|
@ -284,7 +284,7 @@ const onCameraSuccessFj = (file) => {
|
|||
|
||||
const uploadSignUrlFj = (file) => {
|
||||
const base64Data = file
|
||||
uni.request({
|
||||
uni.request({
|
||||
url: '/file/uploadBase64',
|
||||
method: 'POST',
|
||||
data: {
|
||||
|
|
@ -462,7 +462,7 @@ const saveCodeApi = async () => {
|
|||
partPrice: partItems.value[j].partPrice,
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 设置维修类型为1
|
||||
rowData.value.repairDeviceList[i].repairType = 1;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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'
|
||||
|
|
|
|||
|
|
@ -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'
|
||||
|
|
|
|||
|
|
@ -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'
|
||||
|
|
|
|||
|
|
@ -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'
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
@ -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>
|
||||
Loading…
Reference in New Issue