feat(xumu): 添加远程耳标号查询功能
- 在 AppDeathManage 和 AppOutManage 组件中集成 AiEartagRemote 组件 - 实现耳标号远程查询和自动填充功能 -优化用户输入体验,提高数据准确性
This commit is contained in:
		| @@ -1,5 +1,6 @@ | ||||
| <script> | ||||
| import {mapState} from "vuex" | ||||
| import AiEartagRemote from "@project/xumu/components/AiEartagRemote.vue"; | ||||
|  | ||||
| const formImages = [ | ||||
|   {label: "身长测量照片", prop: "heightPic", rules: {required: true, message: '请上传 身长测量照片'}}, | ||||
| @@ -9,6 +10,7 @@ const formImages = [ | ||||
| ] | ||||
| export default { | ||||
|   name: "deathAdd", | ||||
|   components: {AiEartagRemote}, | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     permissions: Function, | ||||
| @@ -71,7 +73,10 @@ export default { | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     } | ||||
|     }, | ||||
|     handlerAutocomplete(value) { | ||||
|       'biochipEarNumber|farmId|houseId|penId|electronicEarNumber|originalEarNumber|category|variety'.split("|").forEach(prop => this.$set(this.detail, prop, value[prop])) | ||||
|     }, | ||||
|   }, | ||||
|   created() { | ||||
|     this.getDetail(this.$route.query.id) | ||||
| @@ -84,7 +89,7 @@ export default { | ||||
|     <el-form size="small" label-width="120px" :model="detail" ref="detail"> | ||||
|       <ai-card title="基础信息"> | ||||
|         <div class="grid c-4"> | ||||
|           <ai-input class="row" v-model="detail.biochipEarNumber" placeholder="请输入耳标号按回车查询,或扫描耳标号" @input="getDetail"/> | ||||
|           <ai-eartag-remote :instance="instance" @enter="handlerAutocomplete" /> | ||||
|           <el-form-item label="生物芯片耳标号"> | ||||
|             <b v-text="detail.biochipEarNumber"/> | ||||
|           </el-form-item> | ||||
| @@ -100,7 +105,7 @@ export default { | ||||
|           <el-form-item label="电子耳标号" prop="electronicEarNumber"> | ||||
|             <b v-text="detail.electronicEarNumber"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="原厂耳标号" prop="category"> | ||||
|           <el-form-item label="原厂耳标号" prop="originalEarNumber"> | ||||
|             <b v-text="detail.originalEarNumber"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="类别" prop="category"> | ||||
|   | ||||
| @@ -1,14 +1,16 @@ | ||||
| <script> | ||||
| import {mapState} from "vuex" | ||||
| import { mapState } from "vuex" | ||||
| import AiEartagRemote from "@project/xumu/components/AiEartagRemote.vue"; | ||||
|  | ||||
| const formImages = [ | ||||
|   {label: "身长测量照片", prop: "heightPic", rules: {required: true, message: '请上传 身长测量照片'}}, | ||||
|   {label: "生物芯片照片", prop: "biochipPic", rules: {required: true, message: '请上传 生物芯片照片'}}, | ||||
|   {label: "防疫耳标照片", prop: "preventionPic", rules: {required: true, message: '请上传 防疫耳标照片'}}, | ||||
|   {label: "其他说明照片", prop: "otherPic", rules: {required: true, message: '请上传 其他说明照片'}}, | ||||
|   { label: "身长测量照片", prop: "heightPic", rules: { required: true, message: '请上传 身长测量照片' } }, | ||||
|   { label: "生物芯片照片", prop: "biochipPic", rules: { required: true, message: '请上传 生物芯片照片' } }, | ||||
|   { label: "防疫耳标照片", prop: "preventionPic", rules: { required: true, message: '请上传 防疫耳标照片' } }, | ||||
|   { label: "其他说明照片", prop: "otherPic", rules: { required: true, message: '请上传 其他说明照片' } }, | ||||
| ] | ||||
| export default { | ||||
|   name: "outAdd", | ||||
|   components: {AiEartagRemote}, | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     permissions: Function, | ||||
| @@ -38,7 +40,7 @@ export default { | ||||
|       this.$router.push(params) | ||||
|     }, | ||||
|     getDetail(id) { | ||||
|       return id && this.instance.post("/api/breed/out/page", {biochipEarNumber: id}).then(res => { | ||||
|       return id && this.instance.post("/api/breed/out/page", { biochipEarNumber: id }).then(res => { | ||||
|         if (res?.data?.records) { | ||||
|           const detail = res.data.records[0] || {} | ||||
|           if (detail.picture) { | ||||
| @@ -46,15 +48,15 @@ export default { | ||||
|               detail[key] = value | ||||
|             }) | ||||
|           } | ||||
|           return this.detail = {...detail} | ||||
|           return this.detail = { ...detail } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     submit() { | ||||
|       this.$refs.detail.validate().then(() => { | ||||
|         const {biochipEarNumber, id, outTime, heightPic, biochipPic, preventionPic, otherPic, reason, remarks} = this.detail | ||||
|         const { biochipEarNumber, id, outTime, heightPic, biochipPic, preventionPic, otherPic, reason, remarks } = this.detail | ||||
|         this.instance.post("/api/breed/out/addOrEdit", { | ||||
|           biochipEarNumber, id, outTime, picture: {heightPic, biochipPic, preventionPic, otherPic}, reason, remarks | ||||
|           biochipEarNumber, id, outTime, picture: { heightPic, biochipPic, preventionPic, otherPic }, reason, remarks | ||||
|         }).then(res => { | ||||
|           if (res?.code == 0 && res?.data != 1) { | ||||
|             this.$confirm("是否返回列表页?", "提交成功").then(() => this.back()).catch(() => this.getDetail(biochipEarNumber)) | ||||
| @@ -64,15 +66,18 @@ export default { | ||||
|     }, | ||||
|     handleAudit() { | ||||
|       this.$refs.form.validate().then(() => { | ||||
|         const {id} = this.detail | ||||
|         this.instance.post("/api/breed/out/audit", null, {params: {id, ...this.form}}).then(res => { | ||||
|         const { id } = this.detail | ||||
|         this.instance.post("/api/breed/out/audit", null, { params: { id, ...this.form } }).then(res => { | ||||
|           if (res?.code == 0) { | ||||
|             this.$message.success("操作成功") | ||||
|             this.back() | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     } | ||||
|     }, | ||||
|     handlerAutocomplete(value) { | ||||
|       'biochipEarNumber|farmId|houseId|penId|electronicEarNumber|originalEarNumber|category|variety'.split("|").forEach(prop => this.$set(this.detail, prop, value[prop])) | ||||
|     }, | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("yesOrNo", "category", "variety", "outReason") | ||||
| @@ -86,69 +91,70 @@ export default { | ||||
|     <el-form size="small" label-width="120px" :model="detail" ref="detail"> | ||||
|       <ai-card title="基础信息"> | ||||
|         <div class="grid c-4"> | ||||
|           <ai-input class="row" v-model="filter" placeholder="请输入耳标号按回车查询,或扫描耳标号" @keyup.enter.native="getDetail(filter)"/> | ||||
|           <ai-eartag-remote :instance="instance" @enter="handlerAutocomplete" /> | ||||
|           <el-form-item label="生物芯片耳标号"> | ||||
|             <b v-text="detail.biochipEarNumber"/> | ||||
|             <b v-text="detail.biochipEarNumber" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="养殖场" prop="farmId"> | ||||
|             <b v-text="detail.farmName"/> | ||||
|             <b v-text="detail.farmName" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="养殖舍" prop="houseId"> | ||||
|             <b v-text="detail.houseName"/> | ||||
|             <b v-text="detail.houseName" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="养殖栏" prop="penId"> | ||||
|             <b v-text="detail.penName"/> | ||||
|             <b v-text="detail.penName" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="电子耳标号" prop="electronicEarNumber"> | ||||
|             <b v-text="detail.electronicEarNumber"/> | ||||
|             <b v-text="detail.electronicEarNumber" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="原厂耳标号" prop="category"> | ||||
|             <b v-text="detail.originalEarNumber"/> | ||||
|           <el-form-item label="原厂耳标号" prop="originalEarNumber"> | ||||
|             <b v-text="detail.originalEarNumber" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="类别" prop="category"> | ||||
|             <b v-text="detail.category"/> | ||||
|             <b v-text="detail.category" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="品种" prop="variety"> | ||||
|             <b v-text="detail.variety"/> | ||||
|             <b v-text="detail.variety" /> | ||||
|           </el-form-item> | ||||
|         </div> | ||||
|       </ai-card> | ||||
|       <ai-card title="上传照片"> | ||||
|         <div class="grid c-4"> | ||||
|           <el-form-item v-for="(img,i) in formImages" :key="i" v-bind="img"> | ||||
|             <ai-uploader v-if="isAdd||isEdit" v-model="detail[img.prop]" :instance="instance" :limit="1" value-is-url/> | ||||
|             <el-image :src="detail[img.prop]" :preview-src-list="[detail[img.prop]]" v-else/> | ||||
|           <el-form-item v-for="(img, i) in formImages" :key="i" v-bind="img"> | ||||
|             <ai-uploader v-if="isAdd || isEdit" v-model="detail[img.prop]" :instance="instance" :limit="1" value-is-url /> | ||||
|             <el-image :src="detail[img.prop]" :preview-src-list="[detail[img.prop]]" v-else /> | ||||
|           </el-form-item> | ||||
|         </div> | ||||
|       </ai-card> | ||||
|       <ai-card title="淘汰录入"> | ||||
|         <div class="grid"> | ||||
|           <el-form-item label="淘汰日期" prop="outTime" :rules="[{required:true,message:'请选择淘汰日期'}]"> | ||||
|             <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-if="isAdd||isEdit" v-model="detail.outTime"/> | ||||
|             <b v-text="detail.outTime"/> | ||||
|           <el-form-item label="淘汰日期" prop="outTime" :rules="[{ required: true, message: '请选择淘汰日期' }]"> | ||||
|             <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-if="isAdd || isEdit" v-model="detail.outTime" /> | ||||
|             <b v-text="detail.outTime" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="淘汰原因" prop="reason" :rules="[{required:true,message:'请选择淘汰原因'}]"> | ||||
|             <ai-select v-if="isAdd||isEdit" v-model="detail.reason" dict="outReason"/> | ||||
|             <b v-text="detail.reason"/> | ||||
|           <el-form-item label="淘汰原因" prop="reason" :rules="[{ required: true, message: '请选择淘汰原因' }]"> | ||||
|             <ai-select v-if="isAdd || isEdit" v-model="detail.reason" dict="outReason" /> | ||||
|             <b v-text="detail.reason" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="备注" prop="remark" class="row"> | ||||
|             <ai-input type="textarea" :row="3" v-model="detail.remark" :edit="isAdd||isEdit"/> | ||||
|             <ai-input type="textarea" :row="3" v-model="detail.remark" :edit="isAdd || isEdit" /> | ||||
|           </el-form-item> | ||||
|         </div> | ||||
|       </ai-card> | ||||
|       <ai-card title="审批信息" v-if="isAuthing"> | ||||
|         <el-form :model="form" size="small" ref="form" label-width="120px"> | ||||
|           <el-form-item label="是否同意" prop="auditStatus" :rules="[{required:true,message:'请选择是否同意'}]"> | ||||
|             <ai-select v-model="form.auditStatus" :select-list="[{dictValue: 2, dictName: '同意'}, {dictValue: 3, dictName: '不同意'}]"/> | ||||
|           <el-form-item label="是否同意" prop="auditStatus" :rules="[{ required: true, message: '请选择是否同意' }]"> | ||||
|             <ai-select v-model="form.auditStatus" | ||||
|               :select-list="[{ dictValue: 2, dictName: '同意' }, { dictValue: 3, dictName: '不同意' }]" /> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="审批意见" prop="auditReason"> | ||||
|             <el-input type="textarea" :row="3" v-model="form.auditReason" clearable placeholder="请输入"/> | ||||
|             <el-input type="textarea" :row="3" v-model="form.auditReason" clearable placeholder="请输入" /> | ||||
|           </el-form-item> | ||||
|         </el-form> | ||||
|       </ai-card> | ||||
|     </el-form> | ||||
|     <div slot="footer"> | ||||
|       <el-button type="primary" @click="submit" v-if="isAdd||isEdit">提交</el-button> | ||||
|       <el-button type="primary" @click="submit" v-if="isAdd || isEdit">提交</el-button> | ||||
|       <el-button type="primary" @click="handleAudit" v-if="isAuthing">提交</el-button> | ||||
|       <el-button @click="back">返回</el-button> | ||||
|     </div> | ||||
|   | ||||
							
								
								
									
										40
									
								
								project/xumu/components/AiEartagRemote.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										40
									
								
								project/xumu/components/AiEartagRemote.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,40 @@ | ||||
| <script> | ||||
|  | ||||
| export default { | ||||
|   name: "AiEartagRemote", | ||||
|   props: { | ||||
|     instance: Function | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       value: "", | ||||
|       info: {} | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getText(biochipEarNumber) { | ||||
|       this.info = {} | ||||
|       return this.instance.post("/api/breed/earTag/page", null, { params: { biochipEarNumber } }).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.info = res.data | ||||
|           this.$emit('enter', this.info) | ||||
|         } | ||||
|       }) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <section class="AiEartagRemote"> | ||||
|     <ai-input v-model="value" placeholder="请输入耳标号按回车查询,或扫描耳标号" @keyup.enter.native="getText(value)" /> | ||||
|   </section> | ||||
|  | ||||
| </template> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .AiEartagRemote { | ||||
|   gap: 8px; | ||||
|   width: 100%; | ||||
| } | ||||
| </style> | ||||
		Reference in New Issue
	
	Block a user