改备注,改耳号,改品种,转场部分模糊查询+多耳号输入

This commit is contained in:
zyh
2026-01-13 11:18:27 +08:00
parent 4c55e8026e
commit e6beaf3b25
8 changed files with 217 additions and 28 deletions

View File

@@ -5,9 +5,16 @@
<el-date-picker v-model="daterangeEventDate" type="daterange" range-separator="-" start-placeholder="开始日期"
end-placeholder="结束日期" value-format="YYYY-MM-DD" />
</el-form-item>
<el-form-item label="耳号" prop="manageTag">
<el-input v-model="queryParams.manageTags" placeholder="请输入管理耳号或电子耳号" clearable @keyup.enter="handleQuery"
style="max-width: 160px;" />
<el-form-item label="耳号" prop="manageTagsList">
<el-select v-model="queryParams.manageTagsList" multiple filterable remote reserve-keyword
placeholder="请输入耳号,支持多选" :remote-method="searchEarNumber" :loading="earLoading" allow-create
default-first-option style="width: 260px">
<el-option v-for="item in earOptions" :key="item" :label="item" :value="item" />
</el-select>
<el-button type="text" @click="clearEarNumbers"
v-if="queryParams.manageTagsList && queryParams.manageTagsList.length > 0" style="margin-left: 8px">
清空
</el-button>
</el-form-item>
<el-form-item label="新耳号" prop="newTag">
<el-input v-model="queryParams.newTag" placeholder="请输入新耳号" clearable @keyup.enter="handleQuery"
@@ -33,7 +40,13 @@
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<div v-if="queryParams.manageTagsList && queryParams.manageTagsList.length > 0" class="selected-ear-numbers">
<span style="margin-right: 10px; color: #606266;">已选耳号</span>
<el-tag v-for="tag in queryParams.manageTagsList" :key="tag" closable @close="removeEarNumber(tag)"
style="margin-right: 8px;">
{{ tag }}
</el-tag>
</div>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd"
@@ -132,7 +145,7 @@
</template>
<script setup name="ChangeEar">
import { listChangeEar, getChangeEar, delChangeEar, addChangeEar, updateChangeEar, getSheepByEarNumber, checkTagExists } from "@/api/produce/manage_sheep/changeEar"
import { listChangeEar, getChangeEar, delChangeEar, addChangeEar, updateChangeEar, getSheepByEarNumber, checkTagExists,searchEarNumbers } from "@/api/produce/manage_sheep/changeEar"
import { listSheepfold_management as listSheepfold } from '@/api/fileManagement/sheepfold_management'
const { proxy } = getCurrentInstance()
@@ -191,7 +204,8 @@ const data = reactive({
})
const { queryParams, form, rules } = toRefs(data)
const earOptions = ref([])
const earLoading = ref(false)
/** 查询修改电子耳号记录列表 */
async function getList() {
loading.value = true;
@@ -258,6 +272,7 @@ function resetQuery() {
queryParams.value.newTag = null
queryParams.value.oldTag = null
queryParams.value.earType = null
queryParams.value.manageTagsList = []
proxy.resetForm("queryRef")
@@ -408,9 +423,31 @@ function getSheepfoldOptions() {
sheepfoldOptions.value = res.rows
})
}
function searchEarNumber(query) {
if (!query) { earOptions.value = []; return }
earLoading.value = true
searchEarNumbers(query.trim()).then(res => {
earOptions.value = res.data || []
}).finally(() => earLoading.value = false)
}
function clearEarNumbers() {
queryParams.value.manageTagsList = []
}
function removeEarNumber(tag) {
const idx = queryParams.value.manageTagsList.indexOf(tag)
if (idx > -1) queryParams.value.manageTagsList.splice(idx, 1)
}
onMounted(() => {
getSheepfoldOptions();
getList();
});
</script>
<style scoped>
.selected-ear-numbers{
margin-bottom: 16px;
padding: 10px;
background: #f5f7fa;
border-radius: 4px;
}
</style>