1200 lines
38 KiB
Vue
1200 lines
38 KiB
Vue
<template>
|
||
<uni-nav-bar
|
||
status-bar
|
||
leftIcon="left"
|
||
title="退料编码"
|
||
backgroundColor="#dcf4ff"
|
||
:border="false"
|
||
fixed
|
||
@clickLeft="leftClick"
|
||
>
|
||
<!-- 使用右侧插槽自定义提交按钮 -->
|
||
<!-- <template #right>
|
||
<button
|
||
class="submit-btn"
|
||
@click="submitCode"
|
||
>
|
||
确定
|
||
</button>
|
||
</template> -->
|
||
</uni-nav-bar>
|
||
<view class="accept page-common">
|
||
<div class="card top-content" :class="{ 'is-expanded': isExpanded }">
|
||
<div class="card-header">
|
||
<div class="title">
|
||
<span class="title-line"></span> 任务信息 <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">
|
||
<span style="height: 100%; display: flex; align-items: center">{{
|
||
taskInfo.unitName
|
||
}}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="退料工程：" name="proName">
|
||
<span style="height: 100%; display: flex; align-items: center">{{
|
||
taskInfo.proName
|
||
}}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="退料单号：" name="code">
|
||
<span style="height: 100%; display: flex; align-items: center">{{
|
||
taskInfo.code
|
||
}}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="退料人员：" name="backPerson">
|
||
<span style="height: 100%; display: flex; align-items: center">{{
|
||
taskInfo.backPerson
|
||
}}</span>
|
||
</uni-forms-item>
|
||
<uni-forms-item label="联系电话：" name="phone">
|
||
<span style="height: 100%; display: flex; align-items: center">{{
|
||
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">
|
||
<uni-row :gutter="24" style="display: flex; align-items: center">
|
||
<uni-col :span="6">接收方式：</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn" @click="onCodeIdentify">编码识别</view>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn" @click="scanStart">二维码识别</view>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn" @click="moveNum">转至数量</view>
|
||
</uni-col>
|
||
</uni-row>
|
||
</div>
|
||
|
||
<ScanQrCode
|
||
ref="scanQrCodeRef"
|
||
@scanSuccess="handleScanSuccess"
|
||
@scanError="handleScanError"
|
||
/>
|
||
|
||
<div class="card" style="margin-top: 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-data-select
|
||
style="width: 100%; height: 90rpx"
|
||
v-model="maCode"
|
||
:localdata="codeList"
|
||
@change="changeMaCode"
|
||
@clear="clearMaCode"
|
||
></uni-data-select>
|
||
</uni-col>
|
||
<uni-col :span="6">
|
||
<view class="coding-btn search-btn" @click="getMaInfo">编码检索</view>
|
||
</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>
|
||
<uni-col :span="16">
|
||
{{ materialName }}
|
||
</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">
|
||
{{ 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
|
||
:value="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">
|
||
<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>
|
||
<uni-col :span="16">
|
||
<!-- <uni-easyinput placeholder="请输入内容" v-model="apDetection"/> -->
|
||
<radio-group @change="changeRadio">
|
||
<radio value="完好" :checked="isRadioCheck" style="margin-right: 5px">完好</radio>
|
||
<radio value="不合格" :checked="!isRadioCheck">不合格</radio>
|
||
</radio-group>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
|
||
<uni-col :span="4">附件：</uni-col>
|
||
<uni-col :span="20">
|
||
<div class="upload-container">
|
||
<div class="upload" @click="uploadImg" v-if="imgList.length < 3">+</div>
|
||
<div class="image-preview" v-for="(img, index) in imgList" :key="index">
|
||
<image :src="img.url" mode="aspectFill"></image>
|
||
<view class="delete-btn" @click.stop="deleteImage(index)">×</view>
|
||
<PreviewImg :imgUrl="img.url" />
|
||
</div>
|
||
</div>
|
||
</uni-col>
|
||
</uni-row>
|
||
<uni-row style="display: flex; align-items: center">
|
||
<uni-col :span="4">备注：</uni-col>
|
||
<uni-col :span="20">
|
||
<uni-easyinput placeholder="请输入备注" v-model="remark" :clearable="false" />
|
||
</uni-col>
|
||
</uni-row>
|
||
</div>
|
||
|
||
<uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
|
||
<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
|
||
v-if="typeList.length > 0"
|
||
scroll-y
|
||
@scrolltolower="onScrollTolower"
|
||
style="flex: 1; overflow: auto"
|
||
>
|
||
<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>
|
||
</scroll-view>
|
||
|
||
<!-- <div class="btn">
|
||
<button class="btn-cont" @click="submitCode">确认</button>
|
||
</div> -->
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, computed } from 'vue'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
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'
|
||
import PreviewImg from '@/components/PreviewImg/index.vue'
|
||
const taskInfo = ref({})
|
||
const maId = ref('') //编码
|
||
const maCode = ref('') //编码
|
||
const typeName = ref('') //物资类型
|
||
const materialName = ref('') //规格型号
|
||
const typeId = ref('') //类型id
|
||
const maStatusName = ref('') //状态
|
||
const apDetection = ref('完好') //外观判定
|
||
const imgBeseUrl = ref('') //图片展示
|
||
const imgList = ref([]) // 图片列表，用于回显
|
||
const bmFileInfos = ref([]) // 上传后的图片信息
|
||
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 remark = ref('')
|
||
const isRadioCheck = ref(true)
|
||
|
||
const leftClick = () => {
|
||
// 返回
|
||
uni.navigateBack({
|
||
delta: 1, // 返回到已存在的页面
|
||
})
|
||
}
|
||
const changeRadio = (e) => {
|
||
console.log(e.detail.value)
|
||
isRadioCheck.value = !isRadioCheck.value
|
||
apDetection.value = e.detail.value
|
||
}
|
||
|
||
// 获取编码下拉
|
||
const getMaCodeList = async () => {
|
||
let param = {
|
||
unitId: taskInfo.value.unitId,
|
||
proId: taskInfo.value.proId,
|
||
id: taskInfo.value.id,
|
||
}
|
||
try {
|
||
const res = await getSelectMachineByIdApi(param)
|
||
console.log('🚀 ~ getMaCodeList ~ res:', res)
|
||
if (!res.data || res.data.length === 0) return
|
||
codeList.value = res.data.map((item) => {
|
||
return {
|
||
value: item.maCode,
|
||
text: item.maCode,
|
||
}
|
||
})
|
||
} catch (error) {
|
||
console.log('🚀 ~ getMaCodeList ~ error:', error)
|
||
}
|
||
}
|
||
|
||
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,
|
||
}
|
||
})
|
||
|
||
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) {
|
||
console.log('🚀 ~ getCodeList ~ error:', error)
|
||
} finally {
|
||
isAllChecked()
|
||
uni.hideLoading()
|
||
}
|
||
}
|
||
|
||
// 选择型号
|
||
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()
|
||
}
|
||
|
||
// 移除已选编码
|
||
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.unshift(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
|
||
}
|
||
|
||
const clearMaCode = () => {
|
||
maCode.value = ''
|
||
typeName.value = ''
|
||
materialName.value = ''
|
||
maStatusName.value = ''
|
||
maId.value = ''
|
||
maCode.value = ''
|
||
typeId.value = ''
|
||
apDetection.value = '完好'
|
||
bmFileInfos.value = []
|
||
imgBeseUrl.value = ''
|
||
imgList.value = []
|
||
}
|
||
//根据编码获取设备类型
|
||
const getMaInfo = () => {
|
||
flag.value = false
|
||
console.log(maCode.value)
|
||
if (!maCode.value) {
|
||
uni.showToast({ title: '请选择设备编码！', icon: 'none' })
|
||
return
|
||
}
|
||
let param = {
|
||
maCode: maCode.value,
|
||
unitId: taskInfo.value.unitId,
|
||
proId: taskInfo.value.proId,
|
||
id: taskInfo.value.id,
|
||
}
|
||
getMachine(param)
|
||
.then((res) => {
|
||
console.log(res)
|
||
if (res.code == 200) {
|
||
if (res.data && res.data.length > 0) {
|
||
typeName.value = res.data[0].typeName
|
||
materialName.value = res.data[0].materialName
|
||
maStatusName.value = res.data[0].maStatusName
|
||
maId.value = res.data[0].maId
|
||
typeId.value = res.data[0].typeId
|
||
} else {
|
||
uni.showToast({ title: '该编码非该单位工程领用，不可退料！', icon: 'none' })
|
||
}
|
||
}
|
||
})
|
||
.catch((error) => {
|
||
console.log(error)
|
||
})
|
||
}
|
||
const qrCode = ref('') //图片展示
|
||
// 二维码扫码
|
||
const scanStart = async () => {
|
||
// qrCode.value = '201909-00100'
|
||
// getMaInfoScan()
|
||
qrCode.value = ''
|
||
if (scanQrCodeRef.value) {
|
||
scanQrCodeRef.value.scanQrCode()
|
||
}
|
||
}
|
||
|
||
// 处理扫描成功事件
|
||
const handleScanSuccess = (result) => {
|
||
qrCode.value = result?.data?.split('?qrcode=')[1] || result?.data
|
||
console.log("xxxxxxxxxxx",result)
|
||
console.log("yyyyyyyyyyy",qrCode.value)
|
||
if (qrCode.value == '') {
|
||
uni.showToast({ title: '扫码识别失败', icon: 'none' })
|
||
} else if(qrCode.value == '操作已取消'){
|
||
qrCode.value = ''
|
||
uni.showToast({ title: '操作已取消', icon: 'none' })
|
||
}else {
|
||
getMaInfoScan()
|
||
}
|
||
}
|
||
|
||
// 处理扫描失败事件
|
||
const handleScanError = (error) => {
|
||
console.error('扫描出错:', error.message)
|
||
uni.showToast({ title: error.message, icon: 'none' })
|
||
}
|
||
|
||
const moveNum = () => {
|
||
uni.navigateTo({ url: `/pages/back/backNum?taskInfo=${JSON.stringify(taskInfo.value)}` })
|
||
}
|
||
|
||
const getMaInfoScan = () => {
|
||
let param = {
|
||
qrCode: qrCode.value,
|
||
unitId: taskInfo.value.unitId,
|
||
proId: taskInfo.value.proId,
|
||
id: taskInfo.value.id,
|
||
}
|
||
uni.request({
|
||
url: '/material/back_apply_info/getMachine',
|
||
method: 'get',
|
||
data: param,
|
||
success: async (res) => {
|
||
console.log(res)
|
||
await getMaCodeList()
|
||
if (!res.data.code) {
|
||
res = JSON.parse(decryptWithSM4(res.data))
|
||
} else {
|
||
res = res.data
|
||
}
|
||
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
|
||
typeName.value = res.data[0].typeName
|
||
materialName.value = res.data[0].typeModelName
|
||
// 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({
|
||
title: '错误提示',
|
||
content: res.msg,
|
||
showCancel: false, // 不显示取消按钮
|
||
confirmText: '关闭',
|
||
})
|
||
}
|
||
},
|
||
})
|
||
|
||
// 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) => {
|
||
// uni.showModal({
|
||
// title: '错误提示',
|
||
// content: error.data.msg,
|
||
// showCancel: false, // 不显示取消按钮
|
||
// confirmText: '关闭',
|
||
// success: (res) => {
|
||
// // if (res.confirm) {
|
||
// // console.log('用户点击关闭')
|
||
// // }
|
||
// }
|
||
// })
|
||
// })
|
||
}
|
||
// // 扫码识别按钮
|
||
// const scanStart = () => {
|
||
// console.log('编码识别--')
|
||
// // 只允许通过相机扫码
|
||
// uni.scanCode({
|
||
// onlyFromCamera: true,
|
||
// scanType: ['qrCode', 'pdf417'],
|
||
// success: (res) => {
|
||
// console.log('扫码结果：' + res.result);
|
||
// maCode.value = res.result;
|
||
// },
|
||
// fail: (err) => {
|
||
// // uni.showToast({
|
||
// // title: '取消',
|
||
// // icon: 'none'
|
||
// // });
|
||
// }
|
||
// });
|
||
// }
|
||
|
||
// function getCamera() {
|
||
// console.log(1)
|
||
// navigator.camera.getPicture(this.onCameraSuccess, this.onCameraError, {
|
||
// quality: 50,
|
||
// destinationType: window.Camera.DestinationType.DATA_URL,
|
||
// sourceType: window.Camera.PictureSourceType.CAMERA,
|
||
// })
|
||
// }
|
||
// function getPhoto() {
|
||
// console.log(2)
|
||
// navigator.camera.getPicture(this.onCameraSuccess, this.onCameraError, {
|
||
// quality: 50,
|
||
// destinationType: window.Camera.DestinationType.DATA_URL,
|
||
// sourceType: window.Camera.PictureSourceType.SAVEDPHOTOALBUM,
|
||
// })
|
||
// }
|
||
// 编码识别按钮
|
||
const onCodeIdentify = () => {
|
||
console.log('编码识别--')
|
||
uni.navigateTo({
|
||
url: `/pages/back/backCodeScan?queryParams=${JSON.stringify(taskInfo.value)}`,
|
||
})
|
||
}
|
||
//提交
|
||
const submitCode = () => {
|
||
console.log(taskInfo.value)
|
||
if (selectCodeList.value.length == 0) {
|
||
uni.showToast({ title: '请添加退料设备！', icon: 'none' })
|
||
} else if (apDetection.value == '不合格' && bmFileInfos.value.length == 0) {
|
||
uni.showToast({ title: '请上传附件！', icon: 'none' })
|
||
} else {
|
||
let obj = {
|
||
// maId: maId.value,
|
||
// maCode: maCode.value,
|
||
typeId: selectTypeId.value,
|
||
apDetection: apDetection.value,
|
||
goodNum: apDetection.value == '完好' ? selectCodeList.value.length : 0,
|
||
badNum: apDetection.value == '不合格' ? selectCodeList.value.length : 0,
|
||
bmFileInfos: bmFileInfos.value,
|
||
maVos: selectCodeList.value,
|
||
remark: remark.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 = ''
|
||
// maId.value = ''
|
||
// maCode.value = ''
|
||
// typeId.value = ''
|
||
apDetection.value = '完好'
|
||
bmFileInfos.value = []
|
||
imgBeseUrl.value = ''
|
||
imgList.value = []
|
||
selectCodeList.value = []
|
||
remark.value = ''
|
||
isRadioCheck.value = true
|
||
// getMaCodeList()
|
||
if (selectTypeId.value) {
|
||
getCodeList()
|
||
}
|
||
// uni.navigateBack({
|
||
// delta: 1 // 返回到已存在的页面
|
||
// });
|
||
if (flag.value) {
|
||
scanStart()
|
||
}
|
||
} else {
|
||
uni.showToast({ title: res.msg, icon: 'none' })
|
||
}
|
||
})
|
||
.catch((error) => {
|
||
console.log(error)
|
||
uni.hideLoading()
|
||
})
|
||
}
|
||
}
|
||
|
||
//上传
|
||
const uploadImg = () => {
|
||
const count = 3 - imgList.value.length
|
||
if (count <= 0) {
|
||
uni.showToast({ title: '最多上传3张图片', icon: 'none' })
|
||
return
|
||
} else {
|
||
uni.showActionSheet({
|
||
itemList: ['拍照', '从相册选择'],
|
||
success: (res) => {
|
||
if (res.tapIndex === 0) {
|
||
getCameraFj()
|
||
} else if (res.tapIndex === 1) {
|
||
// 从相册选择
|
||
getPhotoFj()
|
||
}
|
||
},
|
||
fail: (err) => {
|
||
console.error('操作菜单选择失败:', err)
|
||
},
|
||
})
|
||
}
|
||
}
|
||
|
||
// 附件拍照
|
||
const getCameraFj = () => {
|
||
navigator.camera.getPicture(onCameraSuccessFj, onCameraErrorFj, {
|
||
quality: 50,
|
||
destinationType: window.Camera.DestinationType.DATA_URL,
|
||
sourceType: window.Camera.PictureSourceType.CAMERA,
|
||
})
|
||
}
|
||
// 附件从相册选择
|
||
const getPhotoFj = () => {
|
||
navigator.camera.getPicture(onCameraSuccessFj, onCameraErrorFj, {
|
||
quality: 50,
|
||
destinationType: window.Camera.DestinationType.DATA_URL,
|
||
sourceType: window.Camera.PictureSourceType.SAVEDPHOTOALBUM,
|
||
})
|
||
}
|
||
|
||
const onCameraErrorFj = (message) => {
|
||
console.log(message)
|
||
}
|
||
|
||
const onCameraSuccessFj = (file) => {
|
||
uploadSignUrlFj(file)
|
||
}
|
||
|
||
const generateRandomString = (length) => {
|
||
let result = ''
|
||
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
|
||
const charactersLength = characters.length
|
||
for (let i = 0; i < length; i++) {
|
||
result += characters.charAt(Math.floor(Math.random() * charactersLength))
|
||
}
|
||
return result
|
||
}
|
||
|
||
const uploadSignUrlFj = (file) => {
|
||
const base64Data = file
|
||
|
||
uni.request({
|
||
url: '/file/uploadBase64',
|
||
method: 'POST',
|
||
data: {
|
||
base64File: base64Data,
|
||
fileName: `${generateRandomString(10)}_${Date.now()}.png`,
|
||
fileType: 'image/png',
|
||
},
|
||
success: (uploadRes) => {
|
||
if (!uploadRes.data.code) {
|
||
uploadRes = JSON.parse(decryptWithSM4(uploadRes.data))
|
||
} 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
|
||
})
|
||
bmFileInfos.value.push({
|
||
name: uploadRes.data.name,
|
||
url: uploadRes.data.url,
|
||
taskType: '10',
|
||
})
|
||
uni.showToast({ title: '上传成功', icon: 'none' })
|
||
} else {
|
||
uni.showToast({ title: '上传失败', icon: 'none' })
|
||
}
|
||
},
|
||
fail: (err) => {
|
||
console.error('上传失败', err)
|
||
uni.showToast({ title: '上传失败', icon: 'none' })
|
||
},
|
||
})
|
||
}
|
||
|
||
// 删除图片
|
||
const deleteImage = (index) => {
|
||
imgList.value.splice(index, 1)
|
||
bmFileInfos.value.splice(index, 1)
|
||
}
|
||
|
||
onLoad((options) => {
|
||
console.log(options)
|
||
taskInfo.value = JSON.parse(options.taskInfo)
|
||
console.log(taskInfo.value)
|
||
// getMaCodeList()
|
||
getMaType()
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.submit-btn {
|
||
background-color: #007aff; /* 蓝色背景 */
|
||
color: white; /* 白色文字 */
|
||
border: none; /* 去掉边框 */
|
||
border-radius: 5px; /* 圆角 */
|
||
padding: 0 14px; /* 左右内边距 */
|
||
height: 35px; /* 高度 */
|
||
line-height: 35px; /* 垂直居中 */
|
||
font-size: 15px; /* 字体放大 */
|
||
margin-right: 23px; /* 与边缘间距 */
|
||
}
|
||
::v-deep .tree-item .head {
|
||
/* justify-content: center !important; */
|
||
}
|
||
::v-deep .uni-easyinput__content {
|
||
padding: 0 !important;
|
||
}
|
||
/* 在style部分添加 */
|
||
.upload-container {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 10px;
|
||
}
|
||
|
||
.upload {
|
||
width: 160rpx;
|
||
height: 160rpx;
|
||
background-color: #f7f8fa;
|
||
border: 2rpx dashed #d9d9d9;
|
||
border-radius: 12rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 48rpx;
|
||
color: #bfbfbf;
|
||
transition: all 0.3s ease;
|
||
}
|
||
|
||
.image-preview {
|
||
width: 160rpx;
|
||
height: 160rpx;
|
||
position: relative;
|
||
border-radius: 12rpx;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.image-preview image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.delete-btn {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
background-color: rgba(0, 0, 0, 0.5);
|
||
color: white;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-bottom-left-radius: 12rpx;
|
||
font-size: 32rpx;
|
||
line-height: 32rpx;
|
||
}
|
||
|
||
.uploading-mask {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background-color: rgba(0, 0, 0, 0.3);
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: white;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
::v-deep .uni-radio-input {
|
||
width: 16px;
|
||
height: 16px;
|
||
}
|
||
.accept {
|
||
padding: 24rpx;
|
||
/* height: 95vh; */
|
||
word-break: break-all;
|
||
background-color: #f7f8fa;
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: 100vh; // 关键，撑满整个视口高度
|
||
|
||
// 卡片样式
|
||
.card {
|
||
padding: 32rpx;
|
||
background-color: #fff;
|
||
border-radius: 20rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||
margin-bottom: 24rpx;
|
||
|
||
// 卡片标题
|
||
/* > div:first-child {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #262626;
|
||
margin-bottom: 24rpx;
|
||
position: relative;
|
||
padding-left: 24rpx;
|
||
|
||
&::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
width: 6rpx;
|
||
height: 28rpx;
|
||
background: #3784fb;
|
||
border-radius: 6rpx;
|
||
}
|
||
} */
|
||
.card-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 24rpx;
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #262626;
|
||
position: relative;
|
||
padding-left: 24rpx;
|
||
|
||
.title-line {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
width: 6rpx;
|
||
height: 28rpx;
|
||
background: #3784fb;
|
||
border-radius: 6rpx;
|
||
}
|
||
}
|
||
|
||
.icon {
|
||
transition: transform 0.5s ease; /* 添加动画过渡 */
|
||
transform: rotate(0deg);
|
||
|
||
&.is-expanded {
|
||
transform: rotate(180deg);
|
||
}
|
||
}
|
||
}
|
||
|
||
// 表单样式
|
||
:deep(.uni-forms) {
|
||
.uni-forms-item {
|
||
padding: 24rpx 0;
|
||
margin-bottom: 0;
|
||
border-bottom: 2rpx solid #f5f5f5;
|
||
|
||
&:last-child {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.uni-forms-item__label {
|
||
color: #8c8c8c;
|
||
}
|
||
|
||
span {
|
||
color: #262626;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 扫码按钮样式
|
||
.coding-btn {
|
||
padding: 0 5px;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||
border-radius: 12rpx;
|
||
text-align: center;
|
||
color: #fff;
|
||
font-size: 24rpx;
|
||
font-weight: 600;
|
||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
transform: scale(0.98);
|
||
opacity: 0.9;
|
||
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
||
}
|
||
|
||
// 检索按钮样式
|
||
&.search-btn {
|
||
background: #fff7eb;
|
||
color: #fa8c16;
|
||
border: 2rpx solid #fa8c16;
|
||
box-shadow: none;
|
||
|
||
&:active {
|
||
background: #fff3e0;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 信息展示行
|
||
:deep(.uni-row) {
|
||
/* margin-bottom: 24rpx; */
|
||
|
||
&:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.uni-col-6 {
|
||
color: #8c8c8c;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.uni-col-16 {
|
||
color: #262626;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
// 输入框样式
|
||
.uni-easyinput__content {
|
||
background-color: #f7f8fa;
|
||
border: 2rpx solid #e8e8e8;
|
||
border-radius: 12rpx;
|
||
height: 75rpx;
|
||
padding: 0 24rpx;
|
||
transition: all 0.3s ease;
|
||
|
||
&:focus-within {
|
||
border-color: #3784fb;
|
||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||
}
|
||
|
||
.uni-easyinput__content-input {
|
||
font-size: 28rpx;
|
||
height: 75rpx;
|
||
line-height: 75rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 上传区域样式
|
||
.upload {
|
||
width: 160rpx;
|
||
height: 160rpx;
|
||
background-color: #f7f8fa;
|
||
border: 2rpx dashed #d9d9d9;
|
||
border-radius: 12rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 48rpx;
|
||
color: #bfbfbf;
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
background-color: #f0f0f0;
|
||
border-color: #3784fb;
|
||
}
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 12rpx;
|
||
object-fit: cover;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 底部按钮
|
||
.btn {
|
||
margin-top: auto;
|
||
padding: 32rpx;
|
||
background: #fff;
|
||
box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||
|
||
.btn-cont {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
text-align: center;
|
||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||
color: #fff;
|
||
border-radius: 44rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||
transition: all 0.3s ease;
|
||
|
||
&:active {
|
||
transform: scale(0.98);
|
||
opacity: 0.9;
|
||
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.top-content {
|
||
height: 30px;
|
||
overflow: hidden;
|
||
transition: max-height 0.5s ease-out;
|
||
|
||
&.is-expanded {
|
||
height: 700px !important;
|
||
overflow: visible !important;
|
||
}
|
||
}
|
||
</style>
|