feat:模具点检、保养、维修单-输入框优化

master
黄伟杰 6 days ago
parent 079ecfb861
commit 19c890bf0e

@ -4,7 +4,7 @@
<view class="filter-bar">
<view class="keyword-box">
<input v-model="searchKeyword" class="keyword-input" :placeholder="t('moldCheck.searchPlaceholder')"
<input id="mold-check-keyword-input" v-model="searchKeyword" class="keyword-input" :placeholder="t('moldCheck.searchPlaceholder')"
:focus="keywordFocus" confirm-type="search" @blur="keywordFocus = false" @input="handleKeywordInput"
@confirm="handleSearch" />
</view>
@ -72,12 +72,14 @@
<view class="add-btn" @click="goAdd">
<text class="add-icon">+</text>
</view>
<sv-focus-no-keyboard ref="focusNoKeyboardRef"></sv-focus-no-keyboard>
</view>
</template>
<script setup>
import { computed, nextTick, ref } from 'vue'
import { onLoad, onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
import { onLoad, onReady, onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
import { useI18n } from 'vue-i18n'
import NavBar from '@/components/common/NavBar.vue'
import { getMoldCheckPage } from '@/api/mes/moldCheck'
@ -96,6 +98,8 @@ const pageSize = ref(10)
const scrollTop = ref(0)
const showGoTop = ref(false)
const keywordFocus = ref(false)
const focusNoKeyboardRef = ref(null)
const keywordInputSelector = '#mold-check-keyword-input input, input#mold-check-keyword-input'
let searchTimer = null
@ -125,8 +129,11 @@ onLoad(async () => {
await fetchList(true)
})
onReady(() => {
focusKeywordNoKeyboard()
})
onShow(() => {
activateKeywordFocus()
if (uni.getStorageSync('moldCheckListNeedRefresh') === '1') {
uni.removeStorageSync('moldCheckListNeedRefresh')
fetchList(true)
@ -250,6 +257,14 @@ function activateKeywordFocus() {
})
}
function focusKeywordNoKeyboard() {
nextTick(() => {
setTimeout(() => {
focusNoKeyboardRef.value?.focus(keywordInputSelector)
}, 80)
})
}
function clearSearchTimer() {
if (searchTimer) {
clearTimeout(searchTimer)
@ -557,4 +572,4 @@ function formatDateTime(value) {
line-height: 1;
margin-top: -4rpx;
}
</style>
</style>

@ -4,7 +4,7 @@
<view class="filter-bar">
<view class="keyword-box">
<input v-model="searchKeyword" class="keyword-input" :placeholder="t('moldMaintain.searchPlaceholder')"
<input id="mold-maintain-keyword-input" v-model="searchKeyword" class="keyword-input" :placeholder="t('moldMaintain.searchPlaceholder')"
:focus="keywordFocus" confirm-type="search" @blur="keywordFocus = false" @input="handleKeywordInput"
@confirm="handleSearch" />
</view>
@ -72,12 +72,14 @@
<view class="add-btn" @click="goAdd">
<text class="add-icon">+</text>
</view>
<sv-focus-no-keyboard ref="focusNoKeyboardRef"></sv-focus-no-keyboard>
</view>
</template>
<script setup>
import { computed, nextTick, ref } from 'vue'
import { onLoad, onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
import { onLoad, onReady, onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
import { useI18n } from 'vue-i18n'
import NavBar from '@/components/common/NavBar.vue'
import { getMoldCheckPage } from '@/api/mes/moldCheck'
@ -96,6 +98,8 @@ const pageSize = ref(10)
const scrollTop = ref(0)
const showGoTop = ref(false)
const keywordFocus = ref(false)
const focusNoKeyboardRef = ref(null)
const keywordInputSelector = '#mold-maintain-keyword-input input, input#mold-maintain-keyword-input'
let searchTimer = null
@ -125,8 +129,11 @@ onLoad(async () => {
await fetchList(true)
})
onReady(() => {
focusKeywordNoKeyboard()
})
onShow(() => {
activateKeywordFocus()
if (uni.getStorageSync('moldMaintainListNeedRefresh') === '1') {
uni.removeStorageSync('moldMaintainListNeedRefresh')
fetchList(true)
@ -250,6 +257,14 @@ function activateKeywordFocus() {
})
}
function focusKeywordNoKeyboard() {
nextTick(() => {
setTimeout(() => {
focusNoKeyboardRef.value?.focus(keywordInputSelector)
}, 80)
})
}
function clearSearchTimer() {
if (searchTimer) {
clearTimeout(searchTimer)

@ -5,6 +5,7 @@
<view class="filter-bar">
<view class="keyword-box">
<input
id="mold-repair-keyword-input"
v-model="searchKeyword"
class="keyword-input"
type="text"
@ -79,12 +80,14 @@
<view class="add-btn" @click="openForm('create')">
<text class="add-icon">+</text>
</view>
<sv-focus-no-keyboard ref="focusNoKeyboardRef"></sv-focus-no-keyboard>
</view>
</template>
<script setup>
import { computed, nextTick, ref } from 'vue'
import { onLoad, onReachBottom, onShow } from '@dcloudio/uni-app'
import { onLoad, onReady, onReachBottom, onShow } from '@dcloudio/uni-app'
import { useI18n } from 'vue-i18n'
import NavBar from '@/components/common/NavBar.vue'
import {
@ -107,6 +110,8 @@ const scrollTop = ref(0)
const showGoTop = ref(false)
const keywordFocus = ref(false)
const selectedMoldId = ref('')
const focusNoKeyboardRef = ref(null)
const keywordInputSelector = '#mold-repair-keyword-input input, input#mold-repair-keyword-input'
const statusOptions = computed(() => [
{ label: t('functionCommon.all'), value: '' },
@ -127,12 +132,14 @@ const selectedStatusLabel = computed(() => {
onLoad(async () => {
initialized.value = true
activateKeywordFocus()
await fetchList(true)
})
onReady(() => {
focusKeywordNoKeyboard()
})
onShow(async () => {
activateKeywordFocus()
if (!initialized.value) return
await fetchList(true)
})
@ -195,6 +202,14 @@ function activateKeywordFocus() {
})
}
function focusKeywordNoKeyboard() {
nextTick(() => {
setTimeout(() => {
focusNoKeyboardRef.value?.focus(keywordInputSelector)
}, 80)
})
}
function handleSearch() {
uni.hideKeyboard()
fetchList(true)
@ -553,4 +568,4 @@ function textValue(value) {
line-height: 1;
margin-top: -4rpx;
}
</style>
</style>

Loading…
Cancel
Save