优化布局,整体字体按钮大一点。

选择厂家不回显,提交不成功。
This commit is contained in:
jiang 2025-07-28 18:40:39 +08:00
parent bdca51254b
commit 2bb643a1e7
3 changed files with 686 additions and 556 deletions

View File

@ -1,5 +1,6 @@
<template>
<uni-nav-bar fixed :border="false" background-color="#dcf4ff" color="black" status-bar title="日期更新"><template
<uni-nav-bar fixed :border="false" background-color="#dcf4ff" color="black" status-bar title="日期更新">
<template
v-slot:left>
<view style="display: flex; align-items: center" @click="back">
<!-- 图标 -->
@ -13,52 +14,69 @@
</view>
</template>
</uni-nav-bar>
<div class="content">
<div class="search">
<view class="accept">
<div class="card">
<div style="display: flex; justify-content: space-between; align-items: center">
<uni-easyinput v-model="keyWord" placeholder="请输入设备编码"></uni-easyinput>
<button type="primary" size="mini" @click="handleSearch"
style="margin-left: 10px; background-color: #18bc37">
<button type="primary" size="mini" class="btn-cont" @click="handleSearch"
style="margin-left: 10px;background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
">
查询
</button>
</div>
<div v-if="typeList.length > 1" class="popup" @click="handlePopup">{{ typeName || '请选择对应机具' }}</div>
<div class="search-item" v-if="typeList.length > 0">
<div>设备类型{{ formData.maType }}</div>
<div>规格型号{{ formData.typeName }}</div>
<div>设备编码{{ formData.code }}</div>
<div>本次检修人员{{ formData.repairer }}</div>
<div>本次检修时间{{ formData.repairTime }}</div>
<div>下次检修时间{{ formData.nextRepairTime }}</div>
</div>
<button v-if="typeList.length > 0" type="primary" size="mini" @click="handleSubmit"
style="margin-top: 30px; background-color: #18bc37; width: 100%">
<div v-if="typeList.length > 1" class="card">
<select-one style="width: 100%; height: 90rpx" :options="typeList" placeholder="请选择对应机具"
:key="typeList" @change="handleCheck" />
</div>
<div class="card" v-if="typeList.length > 0">
<div style="margin-bottom: 5px">设备类型{{ formData.maType }}</div>
<div style="margin-bottom: 5px">规格型号{{ formData.typeName }}</div>
<div style="margin-bottom: 5px">设备编码{{ formData.code }}</div>
<div style="margin-bottom: 5px">本次检修人员{{ formData.repairer }}</div>
<div style="margin-bottom: 5px">本次检修时间{{ formData.repairTime }}</div>
<div style="margin-bottom: 5px">下次检修时间{{ formData.nextRepairTime }}</div>
</div>
<div class="btn">
<button class="btn-cont" v-if="typeList.length > 0" type="primary" @click="handleSubmit"
>
确认修改
</button>
</div>
</view>
<uni-popup ref="popup" border-radius="5px 5px 5px 5px" background-color="#fff">
<div v-for="(item, index) in typeList" :key="index" class="popup-item" @click.stop="handleCheck(item)">
<div>{{ item.name }}</div>
<uni-popup ref="popup" class="card">
<div class="card" v-for="(item, index) in typeList" :key="index" @click.stop="handleCheck(item)">
<div style="display: flex; justify-content: space-between; align-items: center">
<uni-data-checkbox v-model="item.isChecked" :localdata="range"
@change="handleCheck(item, $event)"></uni-data-checkbox>
<div class="card">{{ item.name }}</div>
</div>
</div>
</uni-popup>
<ScanQrCode ref="scanQrCodeRef" @scanSuccess="handleScanSuccess" @scanError="handleScanError" />
</template>
<script setup>
import {
import {
getWsMaInfoList,
updateCheckTime
} from '@/services/wsMaInfo/wsMaInfo.js'
import { onLoad } from '@dcloudio/uni-app'
import { reactive, ref } from 'vue'
import ScanQrCode from '@/pages/devicesSearch/ScanQrCode'
updateCheckTime,
} from '@/services/wsMaInfo/wsMaInfo.js'
import { onLoad } from '@dcloudio/uni-app'
import { reactive, ref } from 'vue'
import ScanQrCode from '@/pages/devicesSearch/ScanQrCode'
import SelectOne from '../repair/tree-select/select-one.vue'
const keyWord = ref('')
const formData = reactive({
const keyWord = ref('')
const formData = reactive({
id: '',
maType: '', //
typeName: '', //
@ -66,29 +84,29 @@
repairer: '', //
repairTime: '', //
nextRepairTime: '', //
})
const scanQrCodeRef = ref()
const popup = ref()
const typeName = ref('')
const typeList = ref([])
const range = ref([{ value: 0, text: '' }])
})
const scanQrCodeRef = ref()
const popup = ref()
const typeName = ref('')
const typeList = ref([])
const range = ref([{ value: 0, text: '' }])
onLoad(() => {
onLoad(() => {
console.log('onLoad')
})
})
const back = () => {
const back = () => {
uni.navigateBack({
delta: 1,
})
}
}
const onQrCode = () => {
const onQrCode = () => {
console.log('🚀 ~ onQrCode ~ 二维码:')
if (scanQrCodeRef.value) scanQrCodeRef.value.scanQrCode()
}
}
const handleSearch = () => {
const handleSearch = () => {
console.log('🚀 ~ handleSearch ~ 查询:', keyWord.value)
// typeList.value =[];
reset()
@ -97,12 +115,12 @@
typeList.value = res.data.map(option => {
return {
id: option.id,
name: option.maName + '-' + option.maModel + '-' + option.maCode,
isChecked: 1,
item: option
label: option.maName + '-' + option.maModel + '-' + option.maCode,
/* isChecked: 1,*/
item: option,
}
});
})
if (res.data.length === 1) {
console.log('🚀 ~ getWsMaInfoList ~ res.data.length:', res.data.length)
formData.id = res.data[0].id
@ -118,14 +136,14 @@
}).catch(error => {
console.log(error)
})
}
}
const handlePopup = () => {
const handlePopup = () => {
console.log('🚀 ~ handlePopup ~ 弹窗:')
popup.value.open()
}
}
const handleCheck = (item) => {
const handleCheck = (item) => {
console.log('🚀 ~ handleCheck ~ 单选:', item)
// typeList item.isChecked 0 1
typeList.value.forEach((i) => {
@ -142,36 +160,36 @@
typeName.value = item.name
popup.value.close()
}
}
//
const handleScanSuccess = (result) => {
//
const handleScanSuccess = (result) => {
keyWord.value = result?.data?.split('?qrcode=')[1] || result?.data
if (keyWord.value === '') {
uni.showToast({ title: '扫码识别失败', icon: 'none' })
} else {
handleSearch()
}
}
}
//
const handleScanError = (error) => {
//
const handleScanError = (error) => {
console.error('扫描出错:', error.message)
uni.showToast({ title: error.message, icon: 'none' })
}
//
const reset = () => {
}
//
const reset = () => {
Object.keys(formData).forEach(key => {
formData[key] = ''
})
typeName.value = ''
typeList.value = []
}
}
//
const handleSubmit = () => {
updateCheckTime(formData.id).then(res => {
if(res.code === 200){
//
const handleSubmit = () => {
updateCheckTime(formData.code).then(res => {
if (res.code === 200) {
uni.showToast({
title: res.msg,
icon: 'none',
@ -183,47 +201,138 @@
console.log(error)
})
}
}
</script>
<style scoped lang="scss">
.content {
padding: 10px;
.search {
<style lang="scss">
.accept {
padding: 24rpx;
height: 90vh;
word-break: break-all;
background-color: #f7f8fa;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 30px;
flex-direction: column;
//
.card {
padding: 32rpx;
background-color: #fff;
border-radius: 20rpx;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
margin-bottom: 24rpx;
height: auto;
//
:deep(.uni-forms) {
.uni-forms-item {
padding: 24rpx 0;
margin-bottom: 0;
border-bottom: 2rpx solid #f5f5f5;
&:last-child {
border-bottom: none;
}
.popup {
.uni-forms-item__label {
height: 2.75rem;
color: #8c8c8c;
}
//
.uni-data-select {
.uni-select {
border: 2rpx solid #e8e8e8;
border-radius: 12rpx;
height: 88rpx;
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-select__input-box {
height: 88rpx;
line-height: 88rpx;
}
.uni-select__input-text {
font-size: 28rpx;
color: #262626;
}
}
}
//
.uni-easyinput {
.uni-easyinput__content {
background-color: #f7f8fa;
border: 2rpx solid #e8e8e8;
border-radius: 12rpx;
height: 88rpx;
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: 88rpx;
line-height: 88rpx;
color: #262626;
}
}
}
}
}
}
//
.btn {
margin-top: auto;
padding: 32rpx;
// background: #fff;
// box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05);
display: flex;
justify-content: space-between;
gap: 24rpx;
.btn-cont {
flex: 1;
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);
}
//
&:first-child {
background: #fff;
margin: 0 0 30px;
padding: 5px 10px;
}
color: #3784fb;
border: 2rpx solid #3784fb;
box-shadow: none;
.search-item {
line-height: 1.9;
&:active {
background: #f7f8fa;
}
}
.popup-item {
padding: 10px;
border-bottom: 1px solid #c7c9ce;
display: flex;
align-items: center;
justify-content: space-between;
}
::v-deep .uni-popup__wrapper {
width: calc(100% - 20px);
max-height: 80vh;
overflow: auto;
}
::v-deep .uni-data-checklist {
// flex: 1
flex: none;
}
}
</style>

View File

@ -1,5 +1,20 @@
<template>
<view class="accept">
<div class="card">
<div style="display: flex; justify-content: space-between; align-items: center">
<button type="primary" v-if="fillNum >1" size="mini" @click="handleFillCode"
style="margin-right: 10px;">填充编码
</button>
<!-- 填充数量 -->
<uni-easyinput type="number" v-model="fillNum" maxlength="30" placeholder="请输入填充数量"
@blur="handleFillNumBlur" />
</div>
<div
style="display: flex; flex-wrap: wrap; justify-content: flex-start;max-height: 200px; overflow-y: auto">
<div v-for="(item, index) in maCode" :key="index" style="margin-right: 10px;">{{ item }}</div>
</div>
</div>
<div class="card">
<uni-forms label-width="91px" :border="true">
<uni-forms-item label="机具类型:" name="maName" required>
@ -8,14 +23,20 @@
</uni-forms-item>
<uni-forms-item label="机具规格:" name="maModel" required>
<select-one style="width: 100%; height: 90rpx" :options="maModelList" placeholder="请选择机具规格"
<select-one ref="maModelSelect" style="width: 100%; height: 90rpx" :options="maModelList"
placeholder="请选择机具规格"
:key="maName" @change="onMaModelChange" @clear="onMaModelClear" />
</uni-forms-item>
<uni-forms-item label="机具编码:" name="maCode" required>
<uni-forms-item v-if="fillNum>1" label="机具编码" name="maCode" required>
<div>
<uni-easyinput v-model="prefix" maxlength="30" placeholder="前缀" style="margin-bottom: 10px" />
<uni-easyinput type="number" v-model="postfix" maxlength="30" placeholder="后缀" />
</div>
</uni-forms-item>
<uni-forms-item v-if="fillNum === 1" label="机具编码:" name="maCodeOne" required>
<div style="display: flex; justify-content: space-between; align-items: center;">
<uni-easyinput v-model="prefix" maxlength="30" placeholder="前缀"/>
<span style="margin: 0 10rpx;"> - </span>
<uni-easyinput type="number" v-model="postfix" maxlength="30" placeholder="后缀"/>
<uni-easyinput v-model="maCodeOne" maxlength="30" placeholder="机具编码" />
</div>
</uni-forms-item>
<uni-forms-item label="出厂厂家:" name="supplier" required>
@ -37,17 +58,6 @@
</uni-forms>
</div>
<div class="card">
<div style="display: flex; justify-content: space-between; align-items: center">
<button type="primary" size="mini" @click="handleFillCode" style="margin-right: 10px;">填充编码</button>
<!-- 填充数量 -->
<uni-easyinput type="number" v-model="fillNum" maxlength="30" placeholder="请输入填充数量" @blur="handleFillNumBlur" />
</div>
<div style="display: flex; flex-wrap: wrap; justify-content: flex-start;max-height: 200px; overflow-y: auto">
<div v-for="(item, index) in maCode" :key="index" style="margin-right: 10px;">{{ item }}</div>
</div>
</div>
<div class="btn">
<button class="btn-cont" @click="clearForm">清空</button>
@ -57,51 +67,50 @@
</template>
<script setup>
import {
ref
} from 'vue'
import {
import {
ref,
} from 'vue'
import {
addWsMaInfo,
getMaTypeData,
getMaModeData,
getSupplier
} from '@/services/wsMaInfo/wsMaInfo.js'
import SelectOne from '../tree-select/select-one'
import {
onLoad
} from '@dcloudio/uni-app'
getSupplier,
} from '@/services/wsMaInfo/wsMaInfo.js'
import SelectOne from '../tree-select/select-one'
import {
onLoad,
} from '@dcloudio/uni-app'
const maName = ref('') //
const maModel = ref('') //
const maCode = ref([]) //
const supplier = ref('') //
const repairMan = ref('王鹏') //
const checkMan = ref('高民') //
const phone = ref('0551-63703966') //
const modelId = ref('')
const maNameList = ref([]) //
const maModelList = ref([]) //
const supplierList = ref([]) //
const prefix = ref()
const postfix = ref()
const fillNum = ref(1) //
//
const clearForm = () => {
maName.value = ''
maModel.value = ''
const maName = ref('') //
const maModel = ref('') //
const maCode = ref([]) //
const maCodeOne = ref('')
const supplier = ref('') //
const repairMan = ref('王鹏') //
const checkMan = ref('高民') //
const phone = ref('0551-63703966') //
const modelId = ref('')
const maNameList = ref([]) //
const maModelList = ref([]) //
const supplierList = ref([]) //
const prefix = ref()
const postfix = ref()
const fillNum = ref(1) //
const maModelSelect = ref(null)
//
const clearForm = () => {
maModel.value = null
maModelSelect.value.showLabel = ''
maCode.value = []
supplier.value = ''
repairMan.value = ''
checkMan.value = ''
phone.value = ''
}
maCodeOne.value = ''
}
//
const handleFillCode = () => {
//
const handleFillCode = () => {
if (!prefix.value || !postfix.value) {
uni.showToast({
title: '请填写编码前缀和后缀',
icon: 'none'
icon: 'none',
})
return
}
@ -118,16 +127,16 @@
}
maCode.value = codeList
console.log('🚀 ~ handleFillCode ~ maCode.value:', maCode.value)
}
}
const handleFillNumBlur = () => {
const handleFillNumBlur = () => {
//
fillNum.value = Math.ceil(String(fillNum.value).replace(/[^\d]/g, ''))
}
}
const onMaNameChange = (item) => {
maName.value = item.label;
maModel.value = null; //
const onMaNameChange = (item) => {
maName.value = item.label
maModel.value = null //
getMaModeData(item.id).then(res => {
if (res.code === 200) {
maModelList.value = res.data.map(option => {
@ -135,34 +144,34 @@
id: option.id,
label: option.name,
}
});
})
}
}).catch(error => {
console.log(error)
})
};
}
const onMaModelChange = (item) => {
modelId.value = item.id;
maModel.value = item.label;
}
const onMaModelChange = (item) => {
modelId.value = item.id
maModel.value = item.label
}
const onSupplierChange = (item) => {
supplier.value = item.label;
}
const onSupplierChange = (item) => {
supplier.value = item.label
}
const onMaNameClear = () => {
maName.value = null;
maModel.value = null; //
};
const onMaModelClear = () => {
maModel.value = null;
};
const onSupplierClear = () => {
supplier.value = null;
};
const onMaNameClear = () => {
maName.value = null
maModel.value = null //
}
const onMaModelClear = () => {
maModel.value = null
}
const onSupplierClear = () => {
supplier.value = null
}
const getSupplierSelect = () => {
const getSupplierSelect = () => {
getSupplier().then(res => {
if (res.code === 200) {
supplierList.value = res.data.map(option => {
@ -170,13 +179,13 @@
id: option.id,
label: option.name,
}
});
})
}
}).catch(error => {
console.log(error)
})
}
const getMaName = () => {
}
const getMaName = () => {
getMaTypeData().then(res => {
if (res.code === 200) {
maNameList.value = res.data.map(option => {
@ -184,69 +193,81 @@
id: option.id,
label: option.name,
}
});
})
console.log(maModelList)
}
}).catch(error => {
console.log(error)
})
}
}
//
const confirmAdd = async () => {
//
const confirmAdd = async () => {
console.log(maName.value)
console.log(maCode.value)
if (!maName.value) {
return uni.showToast({
title: '请选择机具类型',
icon: 'none'
icon: 'none',
})
}
if (!maModel.value) {
return uni.showToast({
title: '请选择机具规格',
icon: 'none'
icon: 'none',
})
}
if (fillNum.value === 1) {
if (!maCodeOne.value) {
return uni.showToast({
title: '请填写具编码',
icon: 'none',
})
}
} else {
if (maCode.value.length === 0) {
return uni.showToast({
title: '请生成机具编码',
icon: 'none'
icon: 'none',
})
}
}
if (!supplier.value) {
return uni.showToast({
title: '请输入出厂厂家',
icon: 'none'
icon: 'none',
})
}
if (!repairMan.value) {
return uni.showToast({
title: '请输入检修员',
icon: 'none'
icon: 'none',
})
}
if (!checkMan.value) {
return uni.showToast({
title: '请输入检验员',
icon: 'none'
icon: 'none',
})
}
if (!phone.value) {
return uni.showToast({
title: '请输入联系方式',
icon: 'none'
icon: 'none',
})
}
const postData = {
maName: maName.value,
maModel: maModel.value,
maCodeList: maCode.value,
maCodeList: fillNum.value > 1 ? maCode.value : [maCodeOne.value],
supplier: supplier.value,
repairMan: repairMan.value,
checkMan: checkMan.value,
phone: phone.value,
modelId: modelId.value
modelId: modelId.value,
}
try {
@ -254,24 +275,24 @@
if (res.code === 200) {
uni.showToast({
title: '新增成功',
icon: 'success'
icon: 'success',
})
clearForm()
uni.navigateBack()
//uni.navigateBack()
}
} catch (error) {
console.error(error)
}
}
onLoad(() => {
getMaName();
getSupplierSelect();
})
}
onLoad(() => {
getMaName()
getSupplierSelect()
})
</script>
<style lang="scss">
.accept {
.accept {
padding: 24rpx;
height: 90vh;
word-break: break-all;
@ -399,5 +420,5 @@
}
}
}
}
}
</style>

View File

@ -64,11 +64,11 @@ export const getMaModeData = (parentId) => {
}
export const updateCheckTime = (id) => {
export const updateCheckTime = (maCode) => {
return http({
method: 'POST',
url: '/material/wsMaInfo/updateCheckTime',
data: {id}
data: {maCode}
})
}