批量退料

src/pages/back/backCode.vue

@@ -19,10 +19,19 @@
     </template> -->
     </uni-nav-bar>
     <view class="accept page-common">
-        <div class="card top-content" :class="{'is-expanded': isExpanded}">
+        <div class="card top-content" :class="{ 'is-expanded': isExpanded }">
-            <div class="card-header" @click="isExpanded = !isExpanded">
+            <div class="card-header">
-                <div class="title">任务信息</div>
+                <div class="title">
-                <uni-icons class="icon" type="down" size="19" :class="{'is-expanded': isExpanded}"></uni-icons>
+                    任务信息 <span style="color: #8c8c8c">已选：{{ selectCodeList.length }}</span>
+                </div>
+                <button class="submit-btn" @click="submitCode">确 定</button>
+                <uni-icons
+                    class="icon"
+                    type="down"
+                    size="19"
+                    :class="{ 'is-expanded': isExpanded }"
+                    @click="isExpanded = !isExpanded"
+                ></uni-icons>
             </div>
             <uni-forms :model="taskInfo" label-width="170rpx" :border="true">
                 <uni-forms-item label="退料单位：" name="unitName">
@@ -50,6 +59,29 @@
                         taskInfo.phone
                     }}</span>
                 </uni-forms-item>
+                <uni-forms-item label="" label-width="0" v-if="selectCodeList.length > 0">
+                    <div
+                        style="
+                            display: flex;
+                            align-items: center;
+                            flex-wrap: wrap;
+                            max-height: 249px;
+                            overflow-y: auto;
+                        "
+                    >
+                        <div v-for="(item, index) in selectCodeList" style="margin: 0 5px">
+                            <span
+                                >{{ item.maCode }}
+                                <uni-icons
+                                    type="close"
+                                    size="18"
+                                    color="red"
+                                    @click="removeCode(item)"
+                                ></uni-icons
+                            ></span>
+                        </div>
+                    </div>
+                </uni-forms-item>
             </uni-forms>
         </div>
         <div class="card" style="margin-top: 10px">
@@ -74,10 +106,9 @@
         />
 
         <div class="card" style="margin-top: 10px">
-            <uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
+            <!-- <uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
                 <uni-col :span="6">设备编码：</uni-col>
                 <uni-col :span="12">
-                    <!-- <uni-easyinput placeholder="请输入内容" maxlength="30" v-model="maCode" /> -->
                     <uni-data-select
                         style="width: 100%; height: 90rpx"
                         v-model="maCode"
@@ -107,6 +138,18 @@
                 <uni-col :span="16">
                     {{ maStatusName }}
                 </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="18">
+                    <eselect
+                        v-model="selectTypeId"
+                        style="width: 100%; height: 90rpx; margin: 10px 0"
+                        ref="treeSelect"
+                        :options="typeOptions"
+                        @change="changeType"
+                    ></eselect>
+                </uni-col>
             </uni-row>
 
             <uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
@@ -133,19 +176,75 @@
             </uni-row>
         </div>
 
-        <div class="btn">
+        <uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
-            <button class="btn-cont" @click="submitCode">确认</button>
+            <uni-col :span="6">设备编码：</uni-col>
+            <uni-col :span="6" style="display: flex; align-items: center">
+                <span>全选：</span>
+                <checkbox-group
+                    ><checkbox
+                        value=""
+                        :checked="allChecked"
+                        :disabled="typeList.length == 0"
+                        @click="handleAllChecked"
+                /></checkbox-group>
+            </uni-col>
+            <uni-col :span="12">
+                <uni-easyinput
+                    placeholder="请输入编码"
+                    v-model="keyWord"
+                    :clearable="false"
+                    @change="getCodeList"
+                />
+            </uni-col>
+        </uni-row>
+        <scroll-view
+            scroll-y
+            @scrolltolower="onScrollTolower"
+            style="flex: 1; overflow: auto; min-height: 160px"
+        >
+            <div class="card" style="margin-top: 10px">
+                <uni-row
+                    :gutter="24"
+                    style="display: flex; align-items: center; margin-bottom: 10px"
+                    v-for="(item, index) in typeList"
+                    :key="index"
+                >
+                    <uni-col :span="4">
+                        <checkbox-group
+                            ><checkbox
+                                value=""
+                                :checked="item.checked"
+                                @click="handleItemChecked(item)"
+                        /></checkbox-group>
+                    </uni-col>
+                    <uni-col :span="12" :style="{ color: item.checked ? '#007aff' : '' }">{{
+                        item.maCode
+                    }}</uni-col>
+                    <uni-col :span="8">{{ item.maStatus == 2 ? '在用' : '-' }}</uni-col>
+                </uni-row>
+                <div style="border-bottom: 1px solid #ccc"></div>
             </div>
-    </view>
+        </scroll-view>
 
+        <!-- <div class="btn">
+            <button class="btn-cont" @click="submitCode">确认</button>
+        </div> -->
+    </view>
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue'
+import { ref, computed } from 'vue'
 import { onLoad } from '@dcloudio/uni-app'
-import { getMachine, insertApp, getSelectMachineByIdApi } from '../../services/back.js'
+import {
+    getMachine,
+    insertApp,
+    getSelectMachineByIdApi,
+    getMaTypeApi,
+    getMachineByIdListApi,
+} from '../../services/back.js'
 import ScanQrCode from '@/pages/devicesSearch/ScanQrCode.vue'
 import { baseURL } from '@/utils/http'
+//pages/materialsStation/toolsLease/components/eselect.vue
 import eselect from '@/components/tree-select/eselect.vue'
 import { decryptWithSM4, encryptWithSM4, hashWithSM3AndSalt } from '@/utils/sm'
 const taskInfo = ref({})
@@ -163,6 +262,15 @@ const scanQrCodeRef = ref(null)
 const codeList = ref([])
 const isExpanded = ref(false)
 const flag = ref(false)
+const typeOptions = ref()
+const selectCodeList = ref([])
+const typeList = ref([])
+const selectTypeId = ref('')
+const pageSize = ref(10)
+const allChecked = ref(false)
+const keyWord = ref('')
+const total = ref(0)
+
 const leftClick = () => {
     // 返回
     uni.navigateBack({
@@ -188,7 +296,7 @@ const getMaCodeList = async () => {
         codeList.value = res.data.map((item) => {
             return {
                 value: item.maCode,
-                text: item.maCode
+                text: item.maCode,
             }
         })
     } catch (error) {
@@ -196,6 +304,129 @@ const getMaCodeList = async () => {
     }
 }
 
+const getMaType = async () => {
+    try {
+        const params = {
+            proId: taskInfo.value.proId,
+            unitId: taskInfo.value.unitId,
+        }
+        const res = await getMaTypeApi(params)
+        typeOptions.value = transformTree(res.data)
+    } catch (error) {
+        console.log('🚀 ~ getMaType ~ error:', error)
+    }
+}
+const transformTree = (nodes) => {
+    return nodes.map((item) => {
+        const transformedItem = {
+            ...item,
+            id: item.typeId,
+            name: item.typeName,
+        }
+
+        if (item.children && item.children.length > 0) {
+            transformedItem.children = transformTree(item.children)
+        }
+
+        return transformedItem
+    })
+}
+
+const searchCode = (code) => {
+    console.log('🚀 ~ searchCode ~ code:', keyWord.value)
+}
+// 获取编码列表
+const getCodeList = async () => {
+    try {
+        uni.showLoading({ title: '加载中...', mask: true })
+        const params = {
+            pageNum: 1,
+            pageSize: pageSize.value,
+            id: taskInfo.value.id,
+            unitId: taskInfo.value.unitId,
+            proId: taskInfo.value.proId,
+            typeId: selectTypeId.value,
+            keyWord: keyWord.value,
+        }
+        console.log('🚀 ~ getCodeList ~ params:', params)
+        const res = await getMachineByIdListApi(params)
+        total.value = res.data.total
+        if (!res.data.rows || res.data.rows.length === 0) {
+            typeList.value = []
+            return
+        }
+        typeList.value = res.data.rows.map((item) => {
+            return {
+                ...item,
+                checked: false,
+            }
+        })
+
+        typeList.value.forEach((item) => {
+            item.checked = selectCodeList.value.some((selected) => selected.maCode === item.maCode)
+        })
+
+        console.log('🚀 ~ getCodeList ~ typeList.value:', typeList.value)
+    } catch (error) {
+        console.log('🚀 ~ getCodeList ~ error:', error)
+    } finally {
+        isAllChecked()
+        uni.hideLoading()
+    }
+}
+
+// 选择型号
+const changeType = (e) => {
+    selectCodeList.value = []
+    console.log('🚀 ~ changeType ~ e:', e)
+    selectTypeId.value = e.typeId
+    console.log('🚀 ~ changeType ~ :', selectTypeId.value)
+    getCodeList()
+}
+
+// 移除已选编码
+const removeCode = (item) => {
+    console.log('🚀 ~ removeCode ~ :', item)
+    item.checked = !item.checked
+    selectCodeList.value = selectCodeList.value.filter((el) => el.maCode !== item.maCode) || []
+    isAllChecked()
+}
+
+const handleItemChecked = (item) => {
+    console.log('🚀 ~ handleItemChecked ~ item:', item)
+    item.checked = !item.checked
+    if (item.checked) {
+        selectCodeList.value.push(item)
+    } else {
+        selectCodeList.value = selectCodeList.value.filter((el) => el.maCode !== item.maCode)
+    }
+    isAllChecked()
+}
+
+// 全选
+const handleAllChecked = () => {
+    allChecked.value = !allChecked.value
+    console.log('🚀 ~ isAllChecked:', isAllChecked.value)
+
+    typeList.value.forEach((item) => {
+        item.checked = allChecked.value
+    })
+    selectCodeList.value = allChecked.value ? typeList.value : []
+}
+
+// 更新全选状态
+const isAllChecked = () => {
+    allChecked.value = typeList.value.every((e) => e.checked)
+}
+
+const onScrollTolower = () => {
+    console.log('🚀 ~ onScrollTolower')
+    if (selectTypeId.value && typeList.value.length != total.value) {
+        pageSize.value += 10
+        getCodeList()
+    }
+}
+
 const changeMaCode = (e) => {
     console.log('🚀 ~ changeMaCode ~ e:', e)
     maCode.value = e
@@ -206,7 +437,6 @@ const clearMaCode = () => {
     typeName.value = ''
     materialName.value = ''
     maStatusName.value = ''
-    typeId.value = ''
     maId.value = ''
     maCode.value = ''
     typeId.value = ''
@@ -239,7 +469,6 @@ const getMaInfo = () => {
                     maStatusName.value = res.data[0].maStatusName
                     maId.value = res.data[0].maId
                     typeId.value = res.data[0].typeId
-                    
                 } else {
                     uni.showToast({ title: '该编码非该单位工程领用，不可退料！', icon: 'none' })
                 }
@@ -252,58 +481,10 @@ const getMaInfo = () => {
 const qrCode = ref('') //图片展示
 // 二维码扫码
 const scanStart = async () => {
-    
     qrCode.value = ''
     if (scanQrCodeRef.value) {
         scanQrCodeRef.value.scanQrCode()
     }
-    // var mpaasScanModule = uni.requireNativePlugin('Mpaas-Scan-Module')
-    // mpaasScanModule.mpaasScan(
-    //     {
-    //         // 扫码识别类型，参数可多选，qrCode、barCode，不设置，默认识别所有
-    //         scanType: ['qrCode', 'barCode'],
-    //         // 是否隐藏相册，默认false不隐藏
-    //         hideAlbum: false,
-    //         //ios需要设置这个参数，只支持中英文 zh-Hans、en，默认中文
-    //         language: 'en',
-    //         //相册选择照片识别错误提示(ios)
-    //         failedMsg: '未识别到二维码，请重试',
-    //         //Android支持全屏需要设置此参数
-    //         screenType: 'full',
-    //     },
-    //     (ret) => {
-    //         console.log(ret)
-    //         if (ret.resp_code == 10) {
-    //             uni.showToast({ title: '用户取消', icon: 'none' })
-    //         }
-    //         if (ret.resp_code == 11) {
-    //             uni.showToast({ title: '扫码失败', icon: 'none' })
-    //         }
-    //         if (ret.resp_code == 1000) {
-    //             qrCode.value = ret.resp_result
-    //             console.log(qrCode.value)
-    //             let param = {
-    //                 qrCode: qrCode.value,
-    //                 unitId: taskInfo.value.unitId,
-    //                 proId: taskInfo.value.proId,
-    //             }
-    //             getMachine(param)
-    //                 .then((res) => {
-    //                     console.log(res)
-    //                     console.log(res.data[0])
-    //                     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
-    //                 })
-    //                 .catch((error) => {
-    //                     console.log(error)
-    //                 })
-    //         }
-    //     },
-    // )
 }
 
 // 处理扫描成功事件
@@ -339,19 +520,18 @@ const getMaInfoScan = () => {
         data: param,
         success: async (res) => {
             console.log(res)
-        await getMaCodeList();
+            await getMaCodeList()
-        if(!res.data.code){
+            if (!res.data.code) {
                 res = JSON.parse(decryptWithSM4(res.data))
-        }else{
+            } else {
                 res = res.data
             }
-        console.log("xxxxxxxxxxxxxxxx",res)
+            console.log('xxxxxxxxxxxxxxxx', res)
             if (res.code == 200) {
-            
                 console.log(res)
                 console.log(res.data[0])
-            maCode.value = res.data[0].maCode;
+                maCode.value = res.data[0].maCode
-            console.log("333333333333",maCode.value)
+                console.log('333333333333', maCode.value)
                 console.log('codeList:', JSON.stringify(codeList.value))
                 typeName.value = res.data[0].typeName
                 materialName.value = res.data[0].typeModelName
@@ -359,7 +539,7 @@ const getMaInfoScan = () => {
                 maId.value = res.data[0].maId
                 typeId.value = res.data[0].typeId
                 flag.value = true
-        }else{
+            } else {
                 uni.showModal({
                     title: '错误提示',
                     content: res.msg,
@@ -369,11 +549,11 @@ const getMaInfoScan = () => {
                         // if (res.confirm) {
                         //     console.log('用户点击关闭')
                         // }
-                }
+                    },
                 })
             }
         },
-})
+    })
 
     // getMachine(param)
     //     .then((res) => {
@@ -446,46 +626,49 @@ const onCodeIdentify = () => {
 //提交
 const submitCode = () => {
     console.log(taskInfo.value)
-    if (maId.value == '') {
+    if (selectCodeList.value.length == 0) {
-        uni.showToast({ title: '请先添加退料设备编码！', icon: 'none' })
+        uni.showToast({ title: '请添加退料设备！', icon: 'none' })
     } else if (apDetection.value == '不合格' && bmFileInfos.value.length == 0) {
         uni.showToast({ title: '请上传附件！', icon: 'none' })
     } else {
-        // console.log(typeList.value)
         let obj = {
-            maId: maId.value,
+            // maId: maId.value,
-            maCode: maCode.value,
+            // maCode: maCode.value,
-            typeId: typeId.value,
+            typeId: selectTypeId.value,
             apDetection: apDetection.value,
-            goodNum: apDetection.value == '完好' ? 1 : 0,
+            goodNum: apDetection.value == '完好' ? selectCodeList.value.length : 0,
-            badNum: apDetection.value == '不合格' ? 1 : 0,
+            badNum: apDetection.value == '不合格' ? selectCodeList.value.length : 0,
             bmFileInfos: bmFileInfos.value,
+            maVos: selectCodeList.value,
         }
         let param = {
             backApplyInfo: taskInfo.value,
             backApplyDetails: obj,
         }
+        uni.showLoading({ title: '提交中...', mask: true })
         insertApp(param)
             .then((res) => {
                 console.log(res)
                 if (res.code == 200) {
                     uni.showToast({ title: '添加成功！', icon: 'none' })
+                    uni.hideLoading()
                     typeName.value = ''
                     materialName.value = ''
                     maStatusName.value = ''
-                    typeId.value = ''
+                    // maId.value = ''
-                    maId.value = ''
+                    // maCode.value = ''
-                    maCode.value = ''
+                    // typeId.value = ''
-                    typeId.value = ''
                     apDetection.value = '完好'
                     bmFileInfos.value = []
                     imgBeseUrl.value = ''
                     imgList.value = []
-                    getMaCodeList()
+                    selectCodeList.value = []
+                    // getMaCodeList()
+                    getCodeList()
                     // uni.navigateBack({
                     // 	delta: 1 // 返回到已存在的页面
                     // });
-                    if(flag.value){
+                    if (flag.value) {
                         scanStart()
                     }
                 } else {
@@ -494,6 +677,7 @@ const submitCode = () => {
             })
             .catch((error) => {
                 console.log(error)
+                uni.hideLoading()
             })
     }
 }
@@ -504,7 +688,7 @@ const uploadImg = () => {
     if (count <= 0) {
         uni.showToast({ title: '最多上传3张图片', icon: 'none' })
         return
-  }else{
+    } else {
         uni.showActionSheet({
             itemList: ['拍照', '从相册选择'],
             success: (res) => {
@@ -548,13 +732,13 @@ const onCameraSuccessFj = (file) => {
 }
 
 const generateRandomString = (length) => {
-      let result = '';
+    let result = ''
-      const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+    const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
-      const charactersLength = characters.length;
+    const charactersLength = characters.length
     for (let i = 0; i < length; i++) {
-        result += characters.charAt(Math.floor(Math.random() * charactersLength));
+        result += characters.charAt(Math.floor(Math.random() * charactersLength))
     }
-      return result;
+    return result
 }
 
 const uploadSignUrlFj = (file) => {
@@ -564,25 +748,25 @@ const uploadSignUrlFj = (file) => {
         url: '/file/uploadBase64',
         method: 'POST',
         data: {
-            base64File:base64Data,
+            base64File: base64Data,
             fileName: `${generateRandomString(10)}_${Date.now()}.png`,
-            fileType: 'image/png'
+            fileType: 'image/png',
         },
         success: (uploadRes) => {
-            if(!uploadRes.data.code){
+            if (!uploadRes.data.code) {
                 uploadRes = JSON.parse(decryptWithSM4(uploadRes.data))
-            }else{
+            } else {
                 uploadRes = JSON.parse(uploadRes.data)
             }
             if (uploadRes.code && uploadRes.code == 200) {
                 imgList.value.push({
                     url: uploadRes.data.url, // Show local path first
-                serverUrl: uploadRes.data.url // Store server URL
+                    serverUrl: uploadRes.data.url, // Store server URL
                 })
                 bmFileInfos.value.push({
                     name: uploadRes.data.name,
                     url: uploadRes.data.url,
-                taskType: '10'
+                    taskType: '10',
                 })
                 uni.showToast({ title: '上传成功', icon: 'none' })
             } else {
@@ -592,11 +776,10 @@ const uploadSignUrlFj = (file) => {
         fail: (err) => {
             console.error('上传失败', err)
             uni.showToast({ title: '上传失败', icon: 'none' })
-          }
+        },
     })
 }
 
-
 // 删除图片
 const deleteImage = (index) => {
     imgList.value.splice(index, 1)
@@ -607,7 +790,8 @@ onLoad((options) => {
     console.log(options)
     taskInfo.value = JSON.parse(options.taskInfo)
     console.log(taskInfo.value)
-    getMaCodeList()
+    // getMaCodeList()
+    getMaType()
 })
 </script>
 
@@ -618,13 +802,13 @@ onLoad((options) => {
     border: none; /* 去掉边框 */
     border-radius: 5px; /* 圆角 */
     padding: 0 14px; /* 左右内边距 */
-  height: 30px; /* 高度 */
+    height: 35px; /* 高度 */
-  line-height: 30px; /* 垂直居中 */
+    line-height: 35px; /* 垂直居中 */
     font-size: 15px; /* 字体放大 */
-  margin-right: 2px; /* 与边缘间距 */
+    margin-right: 23px; /* 与边缘间距 */
 }
 ::v-deep .tree-item .head {
-    justify-content: center !important;
+    /* justify-content: center !important; */
 }
 ::v-deep .uni-easyinput__content {
     padding: 0 !important;
@@ -704,6 +888,7 @@ onLoad((options) => {
     background-color: #f7f8fa;
     display: flex;
     flex-direction: column;
+    min-height: 100vh; // 关键，撑满整个视口高度
 
     // 卡片样式
     .card {

src/pages/back/detail.vue

@@ -132,13 +132,16 @@ const getTableList = () => {
 	// 	// "statusList":statusList.value,
 	// }
 	// console.log(obj)
+    uni.showLoading({ title: '提交中...', mask: true })
 	getBackInfo(id.value,keyWord.value).then(res => { 
+        uni.hideLoading()
 		console.log(res) 
         taskInfo.value = res.data.backApplyInfo;
 		tableList.value = res.data.backApplyDetailsList;
 		console.log(taskInfo.value)
 	}).catch(error => {
 		console.log(error)
+        uni.hideLoading()
 	})  
 }
 const search = () => {
@@ -189,6 +192,7 @@ const submit = async () => {
         taskId: taskId.value
     }
     try {
+        uni.showLoading({ title: '提交中...', mask: true })
         const res = await submitBackApply(param)
         if (res.code==200){
             uni.showToast({ title: '提交成功', icon: 'none' })
@@ -197,7 +201,8 @@ const submit = async () => {
         
     } catch (error) {
         console.log('🚀 ~ submit ~ error:', error)
-        uni.showToast({ title: '删除失败', icon: 'none' })
+    } finally {
+        uni.hideLoading()
     }
     //   console.log(param)
     //   submitBackApply(param).then(res => {

src/services/back.js

@@ -300,3 +300,21 @@ export const addHandlingOrder = (data) => {
         data:data,
     })
 }
+
+// 设备类型树
+export const getMaTypeApi = (data) => {
+    return http({
+        method: 'POST',
+        url: '/material/select/getBackDeviceTypeTree',
+        data,
+    })
+}
+
+// 根据id获取编码
+export const getMachineByIdListApi = (data) => {
+    return http({
+        method: 'GET',
+        url: '/material/back_apply_info/selectMachineByIdList',
+        data,
+    })
+}