From 19d93086de89e651985d185e919c11f7dc368786 Mon Sep 17 00:00:00 2001
From: zzyuan <781948537@qq.com>
Date: Mon, 30 Dec 2024 10:33:42 +0800
Subject: [PATCH] =?UTF-8?q?=E9=80=80=E6=96=99=E5=8D=95=E4=BD=8D=E5=B7=A5?=
 =?UTF-8?q?=E7=A8=8B=E6=A0=91=E7=8A=B6=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../material/back/component/addReturn.vue     | 189 +++++++-----------
 src/views/material/back/component/home.vue    | 125 ++++--------
 2 files changed, 112 insertions(+), 202 deletions(-)

diff --git a/src/views/material/back/component/addReturn.vue b/src/views/material/back/component/addReturn.vue
index f46e1a66..7c29184a 100644
--- a/src/views/material/back/component/addReturn.vue
+++ b/src/views/material/back/component/addReturn.vue
@@ -11,7 +11,14 @@
         >
             <el-row>
                 <el-form-item label="退料单位" prop="unitId">
-                    <el-cascader v-model="unitId"
+                    <treeselect
+                        v-model="queryParams.unitId"
+                        :options="unitList" :normalizer="normalizer"
+                        :show-count="true" style="width: 240px" :disable-branch-nodes="true"
+                        noChildrenText="没有数据了" noOptionsText="没有数据" noResultsText="没有搜索结果"
+                        placeholder="请选择退料单位" @select="unitChange"
+                    /> 
+                    <!-- <el-cascader v-model="unitId"
                         :show-all-levels="false"
                         :options="unitList"
                         :props="selectTreeProps"
@@ -20,26 +27,17 @@
                         collapse-tags 
                         @change="unitChange" 
                         placeholder="请选择退料单位"
-                    ></el-cascader> 
-                    <!-- <el-select
-                        v-model="queryParams.unitId"
-                        clearable
-                        filterable
-                        @change="GetProData"
-                        style="width: 240px"
-                        placeholder="请选择" 
-                    >
-                        <el-option
-                            v-for="item in unitList"
-                            :key="item.unitId"
-                            :label="item.unitName"
-                            :value="item.unitId"
-                        >
-                        </el-option>
-                    </el-select> -->
+                    ></el-cascader> -->
                 </el-form-item>
                 <el-form-item label="退料工程" prop="proId">
-                    <el-cascader v-model="projectId"
+                    <treeselect
+                        v-model="queryParams.proId"
+                        :options="proList" :normalizer="normalizer"
+                        :show-count="true" style="width: 240px" :disable-branch-nodes="true"
+                        noChildrenText="没有数据了" noOptionsText="没有数据" noResultsText="没有搜索结果"
+                        placeholder="请选择退料工程" @select="proChange"
+                    />
+                    <!-- <el-cascader v-model="projectId"
                         :show-all-levels="false"
                         :options="proList"
                         :props="selectTreeProps"
@@ -47,23 +45,7 @@
                         collapse-tags 
                         @change="proChange"
                         placeholder="请选择退料工程"  
-                    ></el-cascader> 
-                    <!-- <el-select
-                        v-model="queryParams.proId"
-                        clearable
-                        filterable
-                        @change="GetUnitData"
-                        style="width: 240px"
-                        placeholder="请选择" 
-                    >
-                        <el-option
-                            v-for="item in proList"
-                            :key="item.proId"
-                            :label="item.proName"
-                            :value="item.proId"
-                        >
-                        </el-option>
-                    </el-select> -->
+                    ></el-cascader>   -->
                 </el-form-item>
                 <!-- <el-form-item label="协议号" prop="agreementCode">
                     <el-input
@@ -379,7 +361,10 @@ import {
 import { mapState } from 'vuex'
 import { getInfo, h } from '@/api/login'
 import { getToken } from '@/utils/auth'
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 export default {
+    components: { Treeselect },
     name: 'ReturnApplyAdd',
     dicts: ['ma_machine_status'],
     props: {
@@ -551,47 +536,36 @@ export default {
         ...mapState(['user']),
     },
     methods: {
+         /** 转换菜单数据结构 */
+         normalizer(node) {
+            if (node.children && !node.children.length) {
+                delete node.children;
+            }
+            return {
+                id: node.id,
+                label: node.name,
+                children: node.children,
+            };
+        }, 
         // 获取 来往单位 列表数据
         async GetUnitData() {
                 const params = {
-                    projectId: this.queryParams.proId /*  */,
+                    // projectId: this.queryParams.proId /*  */,
                 }
                 const res = await getUnitList(params)
                 this.unitList = res.data
                 this.GetAgreementInfoById() 
         },
-        unitChange(val){
-            // if(this.equipmentList.length>0){
-                // this.$modal.confirm('是否确认更改退料单位，此操作将清空当前列表？').then(() => {
-                    // this.unitId=val
-                    // this.lastUnitId=val
-                    // if(val&&val.length>0){  
-                    //     this.queryParams.unitId=this.unitId[this.unitId.length - 1]
-                    // }else if(val&&val.length==0){
-                    //     this.queryParams.unitId=""
-                    // }
-                    // this.GetProData()
-                    // this.deviceType=[]
-                    // this.equipmentList=[]
-                    // this.$message.success('操作成功!')
-                // }).catch(() => {
-
-                //     console.log(val)
-                //     console.log(this.unitId)
-                //     console.log(this.lastUnitId)
-                //     // this.unitId=this.lastUnitId
-                //     // this.$message.success('操作成功!')
-                // })
-            // }else{
-                // this.unitId=val
-                // this.lastUnitId=val
-                if(val&&val.length>0){  
-                    this.queryParams.unitId=this.unitId[this.unitId.length - 1]
-                }else if(val&&val.length==0){
-                    this.queryParams.unitId=""
-                }
-                this.GetProData()
+        unitChange(val){ 
+            // if(val&&val.length>0){  
+            //     this.queryParams.unitId=this.unitId[this.unitId.length - 1]
+            // }else if(val&&val.length==0){
+            //     this.queryParams.unitId=""
             // }
+            // this.GetProData() 
+            setTimeout(()=>{
+                this.GetProData()
+            },500)  
         },
         // 获取 工程名称 列表数据
         async GetProData() {
@@ -600,54 +574,20 @@ export default {
                 }
                 const res = await getProjectList(params)
                 this.proList = res.data
+                this.queryParams.proId=null
                 this.GetAgreementInfoById() 
+                
         },
-        proChange(val){
-            console.log(this.projectId)
-            console.log(val)
-            // if(this.equipmentList.length>0){
-                // this.$modal.confirm('是否确认更改退料单位，此操作将清空当前列表？').then(() => {
-                    // console.log(val)
-                    // console.log(this.projectId)
-                    // console.log(this.lastProjectId)
-                    // this.projectId=val
-                    // this.lastProjectId=val
-                    // if(val&&val.length>0){
-                    //     this.queryParams.proId=this.projectId[this.projectId.length - 1]
-                    // }else if(val&&val.length==0){
-                    //     this.queryParams.proId=""
-                    // }
-                    // this.GetUnitData()
-                    // this.deviceType=[]
-                    // this.equipmentList=[]
-                    // this.$message.success('操作成功!')
-                // }).catch(() => { 
-                //     console.log(val)
-                //     console.log(this.projectId)
-                //     console.log(this.lastProjectId)
-                //     // this.$nextTick(()=>{
-                //         // setTimeout(()=>{
-                //         //     val = this.lastProjectId
-                //         //     this.projectId = this.lastProjectId
-                //         //     this.$forceUpdate()
-                //         // },1000)
-                //     // })
-                    
-                //     // this.projectId=this.lastProjectId
-                // })
-            // }else{
-                // console.log(val)
-                // console.log(this.projectId)
-                // console.log(this.lastProjectId)
-                // this.projectId=val
-                // this.lastProjectId=val
-                if(val&&val.length>0){
-                    this.queryParams.proId=this.projectId[this.projectId.length - 1]
-                }else if(val&&val.length==0){
-                    this.queryParams.proId=""
-                }
+        proChange(val){ 
+            // if(val&&val.length>0){
+            //     this.queryParams.proId=this.projectId[this.projectId.length - 1]
+            // }else if(val&&val.length==0){
+            //     this.queryParams.proId=""
+            // }
+            // this.GetUnitData()
+            setTimeout(()=>{
                 this.GetUnitData()
-            // } 
+            },500) 
         },
         // 获取 设备树结构数据
         async GetDeviceTypeTreeFn(agreementId) {
@@ -657,6 +597,7 @@ export default {
             const res = await getDeviceTreeByAgreementId(params)
             console.log('resgetUseTypeTreee==========', res)
             this.deviceTypeTree = res.data;
+            
             //反显
             let selectList = []
             this.equipmentList.forEach((e) => {
@@ -665,8 +606,7 @@ export default {
                 )
             })
             this.deviceType = selectList
-            this.$forceUpdate()
-            
+            this.$forceUpdate() 
         },
         //树结构数据获取父
         getParentsById(list, id) {
@@ -698,11 +638,13 @@ export default {
                     this.$message.error('当前单位和工程无协议！')
                     this.queryParams.unitId = null
                     this.queryParams.proId = null
+                    this.equipmentList = []
                     this.GetUnitData()
                     this.GetProData()
                 } else {
                     this.queryParams.agreementId = res.data.agreementId
                     this.queryParams.agreementCode = res.data.agreementCode
+                    this.equipmentList = []
                     this.GetDeviceTypeTreeFn(res.data.agreementId)
                 }
             }
@@ -712,17 +654,22 @@ export default {
         async GetViewByApply(params) {
             const res = await getBackApplyInfo(this.rowId)
             console.log(res) 
-            const data = res.data 
-            this.queryParams.unitId = data.backApplyInfo.unitId 
-            this.unitId = this.treeParentsById(this.unitList, this.queryParams.unitId) 
-            this.queryParams.proId = data.backApplyInfo.proId
-            this.projectId = this.treeParentsById(this.proList, this.queryParams.proId)  
+            const data = res.data
+            this.queryParams.unitId = data.backApplyInfo.unitId; 
+            // this.unitId = this.treeParentsById(this.unitList, this.queryParams.unitId) 
+            this.GetProData()
+            setTimeout(() => {
+                this.queryParams.proId = data.backApplyInfo.proId
+            }, 500);
+            // this.projectId = this.treeParentsById(this.proList, this.queryParams.proId)  
+           
             this.queryParams.phone = data.backApplyInfo.phone
             this.queryParams.backPerson = data.backApplyInfo.backPerson
             this.queryParams.agreementId = data.backApplyInfo.agreementId
-            this.queryParams.remark = data.backApplyInfo.remark
+            this.queryParams.remark = data.backApplyInfo.remark 
             this.equipmentList = data.backApplyDetailsList
             this.GetDeviceTypeTreeFn(data.backApplyInfo.agreementId)
+            
         }, 
         //单位，工程树结构数据获取父
         treeParentsById(list, id) {
diff --git a/src/views/material/back/component/home.vue b/src/views/material/back/component/home.vue
index ac7eaffe..4e5b289d 100644
--- a/src/views/material/back/component/home.vue
+++ b/src/views/material/back/component/home.vue
@@ -52,56 +52,22 @@
             </el-form-item>
             <br>
            <el-form-item label="退料单位" prop="unitId">
-                    <el-cascader v-model="unitId"
-                        :show-all-levels="false"
-                        :options="unitList"
-                        :props="selectTreeProps"
-                        filterable
-                        clearable
-                        collapse-tags
-                        @change="unitChange"
-                        placeholder="请选择退料单位"
-                    ></el-cascader>
-                <!-- <el-select
+                <treeselect
                     v-model="queryParams.unitId"
-                    clearable
-                    filterable
-                    @change="GetProData"
-                    style="width: 240px"
-                    placeholder="请选择"
-                >
-                    <el-option
-                        v-for="item in unitList"
-                        :key="item.unitId"
-                        :label="item.unitName"
-                        :value="item.unitId"
-                    ></el-option>
-                </el-select> -->
+                    :options="unitList" :normalizer="normalizer"
+                    :show-count="true" style="width: 240px" :disable-branch-nodes="true"
+                    noChildrenText="没有数据了" noOptionsText="没有数据" noResultsText="没有搜索结果"
+                    placeholder="请选择退料单位" @select="unitChange"
+                /> 
             </el-form-item>
             <el-form-item label="退料工程" prop="proId">
-                <el-cascader v-model="projectId"
-                        :show-all-levels="false"
-                        :options="proList"
-                        :props="selectTreeProps"
-                        filterable clearable
-                        collapse-tags
-                        @change="proChange"
-                        placeholder="请选择退料工程"
-                    ></el-cascader>
-                <!-- <el-select
+                <treeselect
                     v-model="queryParams.proId"
-                    clearable
-                    filterable
-                    style="width: 240px"
-                    placeholder="请选择"
-                >
-                    <el-option
-                        v-for="item in proList"
-                        :key="item.proId"
-                        :label="item.proName"
-                        :value="item.proId"
-                    ></el-option>
-                </el-select> -->
+                    :options="proList" :normalizer="normalizer"
+                    :show-count="true" style="width: 240px" :disable-branch-nodes="true"
+                    noChildrenText="没有数据了" noOptionsText="没有数据" noResultsText="没有搜索结果"
+                    placeholder="请选择退料工程" @select="proChange"
+                />
             </el-form-item>
             <el-form-item>
                 <el-button
@@ -386,11 +352,12 @@ import {
 //     // getUseNumByTypeId
 // } from '@/api/claimAndRefund/receive.js'
 import dialogFormByCq from '@/views/material/back/component/dialogFormByCq.vue'
-
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 export default {
     name: '',
     dicts: ['back_task_status'],
-    components: { dialogFormByCq },
+    components: { dialogFormByCq,Treeselect },
     data() {
         return {
             fullscreenLoading: false,
@@ -422,7 +389,7 @@ export default {
                 pageNum: 1,
                 pageSize: 10,
                 keyWord: '', //关键字
-                unitId: '', //单位id
+                unitId: null, //单位id
                 lotId: '', //工程id
                 status: '', //状态
                 typeId: '', //工机具类型
@@ -430,7 +397,7 @@ export default {
                 agreementCode: '', //协议
                 startTime: '',
                 endTime: '',
-                proId: '',
+                proId: null,
             },
             selectTreeProps: {
                 children: 'children',
@@ -469,8 +436,7 @@ export default {
             openTextOne: '',
             openTextTwo: '',
             openTextThree: '',
-            companyId: '',
-            deptOptions: [],
+            companyId: '', 
             unitList: [],
             proList: [],
             taskStatusList: [
@@ -491,16 +457,20 @@ export default {
     },
     created() {
         this.getList();
-        this.initSelectData()
-        // this.InitIGetInfo()
+        this.initSelectData() 
     },
     methods: {
-        InitIGetInfo() {
-            // getInfo().then((res) => {
-            //     this.companyId = res.user.companyId
-            //     this.getList()
-            // })
-        },
+        /** 转换菜单数据结构 */
+        normalizer(node) {
+            if (node.children && !node.children.length) {
+                delete node.children;
+            }
+            return {
+                id: node.id,
+                label: node.name,
+                children: node.children,
+            };
+        }, 
         initSelectData() {
             this.GetUnitData()
             this.GetProData()
@@ -508,37 +478,30 @@ export default {
         // 获取 来往单位 列表数据
         async GetUnitData() {
                 const params = {
-                    projectId: this.queryParams.proId /*  */,
+                    // projectId: this.queryParams.proId /*  */,
                 }
                 const res = await getUnitList(params)
-                this.unitList = res.data
+                this.unitList = res.data 
         },
-        unitChange(val){
-            if(val&&val.length>0){
-                this.queryParams.unitId=this.unitId[this.unitId.length - 1]
-            }else if(val&&val.length==0){
-                this.queryParams.unitId=""
-            }
-            this.GetProData()
-        },
-
+        unitChange(val){ 
+            setTimeout(()=>{
+                this.GetProData()
+            },500)  
+        }, 
         // 获取 工程名称 列表数据
         async GetProData() {
                 const params = {
                     unitId: this.queryParams.unitId,
                 }
                 const res = await getProjectList(params)
-                this.proList = res.data
+                this.proList = res.data;
+                this.queryParams.proId=null
         },
-        proChange(val){
-            if(val&&val.length>0){
-                this.queryParams.proId=this.projectId[this.projectId.length - 1]
-            }else if(val&&val.length==0){
-                this.queryParams.proId=""
-            }
-            this.GetUnitData()
-        },
-
+        proChange(val){ 
+            setTimeout(()=>{
+                this.GetUnitData()
+            },500) 
+        }, 
         /** 查询列表 startTime,结束日期endTime  */
         async getList() {
             this.loading = true