127 lines
3.2 KiB
Vue
127 lines
3.2 KiB
Vue
|
<template>
|
||
|
|
<!-- 搜索框入口 -->
|
||
|
|
<view @click="visible = true">
|
||
|
|
<wd-search :placeholder="placeholder" hide-cancel disabled />
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- 搜索弹窗 -->
|
||
|
|
<wd-popup v-model="visible" position="top" @close="visible = false">
|
||
|
|
<view class="yd-search-form-container" :style="{ paddingTop: `${getNavbarHeight()}px` }">
|
||
|
|
<view class="yd-search-form-item">
|
||
|
|
<view class="yd-search-form-label">
|
||
|
|
采摘编号
|
||
|
|
</view>
|
||
|
|
<wd-input
|
||
|
|
v-model="formData.pickCode"
|
||
|
|
placeholder="请输入采摘编号"
|
||
|
|
clearable
|
||
|
|
/>
|
||
|
|
</view>
|
||
|
|
<view class="yd-search-form-item">
|
||
|
|
<view class="yd-search-form-label">
|
||
|
|
采摘人员
|
||
|
|
</view>
|
||
|
|
<wd-input
|
||
|
|
v-model="formData.userName"
|
||
|
|
placeholder="请输入采摘人员姓名"
|
||
|
|
clearable
|
||
|
|
/>
|
||
|
|
</view>
|
||
|
|
<view class="yd-search-form-item">
|
||
|
|
<view class="yd-search-form-label">
|
||
|
|
状态
|
||
|
|
</view>
|
||
|
|
<wd-radio-group v-model="formData.status" shape="button">
|
||
|
|
<wd-radio :value="-1">
|
||
|
|
全部
|
||
|
|
</wd-radio>
|
||
|
|
<wd-radio :value="1">
|
||
|
|
已采摘
|
||
|
|
</wd-radio>
|
||
|
|
<wd-radio :value="2">
|
||
|
|
已装框
|
||
|
|
</wd-radio>
|
||
|
|
<wd-radio :value="3">
|
||
|
|
已装车
|
||
|
|
</wd-radio>
|
||
|
|
<wd-radio :value="4">
|
||
|
|
已入库
|
||
|
|
</wd-radio>
|
||
|
|
</wd-radio-group>
|
||
|
|
</view>
|
||
|
|
<view class="yd-search-form-actions">
|
||
|
|
<wd-button class="flex-1" plain @click="handleReset">
|
||
|
|
重置
|
||
|
|
</wd-button>
|
||
|
|
<wd-button class="flex-1" type="primary" @click="handleSearch">
|
||
|
|
搜索
|
||
|
|
</wd-button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</wd-popup>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { computed, reactive, ref } from 'vue'
|
||
|
|
import { getNavbarHeight } from '@/utils'
|
||
|
|
|
||
|
|
const emit = defineEmits<{
|
||
|
|
search: [data: Record<string, any>]
|
||
|
|
reset: []
|
||
|
|
}>()
|
||
|
|
|
||
|
|
const visible = ref(false)
|
||
|
|
const formData = reactive({
|
||
|
|
pickCode: undefined as string | undefined,
|
||
|
|
userName: undefined as string | undefined,
|
||
|
|
status: -1,
|
||
|
|
})
|
||
|
|
|
||
|
|
const statusMap: Record<number, string> = {
|
||
|
|
1: '已采摘',
|
||
|
|
2: '已装框',
|
||
|
|
3: '已装车',
|
||
|
|
4: '已入库',
|
||
|
|
}
|
||
|
|
|
||
|
|
/** 搜索条件 placeholder 拼接 */
|
||
|
|
const placeholder = computed(() => {
|
||
|
|
const conditions: string[] = []
|
||
|
|
if (formData.pickCode) {
|
||
|
|
conditions.push(`编号:${formData.pickCode}`)
|
||
|
|
}
|
||
|
|
if (formData.userName) {
|
||
|
|
conditions.push(`人员:${formData.userName}`)
|
||
|
|
}
|
||
|
|
if (formData.status !== -1) {
|
||
|
|
conditions.push(`状态:${statusMap[formData.status] || formData.status}`)
|
||
|
|
}
|
||
|
|
return conditions.length > 0 ? conditions.join(' | ') : '搜索采摘记录'
|
||
|
|
})
|
||
|
|
|
||
|
|
/** 搜索 */
|
||
|
|
function handleSearch() {
|
||
|
|
visible.value = false
|
||
|
|
const params: Record<string, any> = {}
|
||
|
|
if (formData.pickCode) {
|
||
|
|
params.pickCode = formData.pickCode
|
||
|
|
}
|
||
|
|
if (formData.userName) {
|
||
|
|
params.userName = formData.userName
|
||
|
|
}
|
||
|
|
if (formData.status !== -1) {
|
||
|
|
params.status = formData.status
|
||
|
|
}
|
||
|
|
emit('search', params)
|
||
|
|
}
|
||
|
|
|
||
|
|
/** 重置 */
|
||
|
|
function handleReset() {
|
||
|
|
formData.pickCode = undefined
|
||
|
|
formData.userName = undefined
|
||
|
|
formData.status = -1
|
||
|
|
visible.value = false
|
||
|
|
emit('reset')
|
||
|
|
}
|
||
|
|
</script>
|