feat(xumu): 新增淘汰登记功能
- 添加 AppOutManage组件,包含新增和列表页面- 实现淘汰登记的新增、编辑、审核等功能 -集成字典加载、表格展示、搜索筛选等模块 -优化表单验证和图片上传功能
This commit is contained in:
		
							
								
								
									
										35
									
								
								project/xumu/AppOutManage/AppOutManage.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										35
									
								
								project/xumu/AppOutManage/AppOutManage.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,35 @@ | ||||
| <script> | ||||
| import add from "./add.vue"; | ||||
| import list from "./list.vue"; | ||||
|  | ||||
| export default { | ||||
|   name: "AppOutManage", | ||||
|   label: "淘汰登记", | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function | ||||
|   }, | ||||
|   computed: { | ||||
|     currentPage() { | ||||
|       let {hash} = this.$route | ||||
|       return hash == "#add" ? add : list | ||||
|     } | ||||
|   }, | ||||
|   data() { | ||||
|     return {} | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <section class="AppOutManage"> | ||||
|     <component :is="currentPage" v-bind="$props"/> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .AppOutManage { | ||||
|   height: 100%; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										163
									
								
								project/xumu/AppOutManage/add.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										163
									
								
								project/xumu/AppOutManage/add.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,163 @@ | ||||
| <script> | ||||
| import {mapState} from "vuex" | ||||
|  | ||||
| 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: '请上传 其他说明照片'}}, | ||||
| ] | ||||
| export default { | ||||
|   name: "outAdd", | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     permissions: Function, | ||||
|     dict: Object | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       formImages, | ||||
|       detail: {}, | ||||
|       form: {} | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(["user"]), | ||||
|     userinfo: v => v.user.info || {}, | ||||
|     isAdd: v => !v.$route.query.id, | ||||
|     isEdit: v => v.$route.query.edit == 1, | ||||
|     isAuthing: v => v.detail.auditStatus == 1, | ||||
|     pageTitle: v => { | ||||
|       const appName = v.$parent.menuName || v.$parent.$options.label | ||||
|       return v.$route.query.id ? v.isEdit ? `编辑${appName}` : `${appName}详情` : `新增${appName}` | ||||
|     }, | ||||
|   }, | ||||
|   methods: { | ||||
|     back(params = {}) { | ||||
|       this.$router.push(params) | ||||
|     }, | ||||
|     getDetail(id) { | ||||
|       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) { | ||||
|             Object.entries(JSON.parse(detail.picture)).forEach(([key, value]) => { | ||||
|               detail[key] = value | ||||
|             }) | ||||
|           } | ||||
|           return this.detail = {...detail} | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     submit() { | ||||
|       this.$refs.detail.validate().then(() => { | ||||
|         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 | ||||
|         }).then(res => { | ||||
|           if (res?.code == 0 && res?.data != 1) { | ||||
|             this.$confirm("是否返回列表页?", "提交成功").then(() => this.back()).catch(() => this.getDetail(biochipEarNumber)) | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|     handleAudit() { | ||||
|       this.$refs.form.validate().then(() => { | ||||
|         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() | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("yesOrNo", "category", "variety", "outReason") | ||||
|     this.getDetail(this.$route.query.id) | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <ai-page :title="pageTitle" class="outAdd" showBack content-string="blank"> | ||||
|     <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"/> | ||||
|           <el-form-item label="生物芯片耳标号"> | ||||
|             <b v-text="detail.biochipEarNumber"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="养殖场" prop="farmId"> | ||||
|             <b v-text="detail.farmName"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="养殖舍" prop="houseId"> | ||||
|             <b v-text="detail.houseName"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="养殖栏" prop="penId"> | ||||
|             <b v-text="detail.penName"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="电子耳标号" prop="electronicEarNumber"> | ||||
|             <b v-text="detail.electronicEarNumber"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="原厂耳标号" prop="category"> | ||||
|             <b v-text="detail.originalEarNumber"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="类别" prop="category"> | ||||
|             <b v-text="detail.category"/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="品种" prop="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> | ||||
|         </div> | ||||
|       </ai-card> | ||||
|       <ai-card title="淘汰录入"> | ||||
|         <div class="grid"> | ||||
|           <el-form-item label="淘汰日期" prop="createTime" :rules="[{required:true,message:'请选择淘汰日期'}]"> | ||||
|             <el-date-picker v-if="isAdd||isEdit" v-model="detail.createTime"/> | ||||
|             <b v-text="detail.createTime"/> | ||||
|           </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> | ||||
|           <el-form-item label="备注" prop="remark" class="row"> | ||||
|             <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> | ||||
|           <el-form-item label="审批意见" prop="auditReason"> | ||||
|             <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="handleAudit" v-if="isAuthing">提交</el-button> | ||||
|       <el-button @click="back">返回</el-button> | ||||
|     </div> | ||||
|   </ai-page> | ||||
| </template> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .outAdd { | ||||
|   .el-date-editor { | ||||
|     width: 100%; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										143
									
								
								project/xumu/AppOutManage/list.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										143
									
								
								project/xumu/AppOutManage/list.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,143 @@ | ||||
| <script> | ||||
| import {mapState} from "vuex" | ||||
|  | ||||
| const columns = [ | ||||
|   {label: "序号", type: "index"}, | ||||
|   {label: "养殖场", prop: "userName", format: (v, row) => `${[row.farmName, row.houseName, row.penName].join("-")}`}, | ||||
|   {label: "生物芯片耳标号", prop: "biochipEarNumber"}, | ||||
|   {label: "类别", prop: "category", dict: "category", width: 120}, | ||||
|   {label: "品种", prop: "variety", dict: "variety", width: 120}, | ||||
|   {label: "日龄(天)", prop: "age", width: 80}, | ||||
|   {label: "淘汰时间", prop: "outTime"}, | ||||
|   {label: "淘汰原因", prop: "reason", width: 80}, | ||||
|   {label: "登记时间", prop: "createTime"}, | ||||
|   {label: "操作人", prop: "userName", width: 100}, | ||||
|   {label: "审核状态", prop: "auditStatus", dict: "auditStatus", width: 80}, | ||||
| ] | ||||
| export default { | ||||
|   name: "outList", | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       columns, | ||||
|       tableData: [], | ||||
|       page: {pageNum: 1, pageSize: 10, total: 0}, | ||||
|       search: {}, | ||||
|       dialog: false, | ||||
|       form: {} | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     userinfo: v => v.user.info || {}, | ||||
|     pageTitle: v => v.$parent.menuName || v.$parent.$options.label | ||||
|   }, | ||||
|   watch: { | ||||
|     search: { | ||||
|       deep: true, | ||||
|       handler() { | ||||
|         this.page.pageNum = 1 | ||||
|         this.getTableData() | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getTableData() { | ||||
|       this.instance.post("/api/breed/out/page", {...this.page, ...this.search}).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.tableData = res.data?.records | ||||
|           this.page.total = res.data.total | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     handleDelete(id) { | ||||
|       this.$confirm("确定删除该条数据?").then(() => { | ||||
|         this.instance.post("/api/breed/weight/del", null, { | ||||
|           params: {id} | ||||
|         }).then(res => { | ||||
|           if (res?.code == 0) { | ||||
|             this.getTableData() | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|     handleAuditAgain(id) { | ||||
|       this.$confirm("是否要再次提交审批?").then(() => { | ||||
|         this.instance.post("/api/breed/out/audit", null, { | ||||
|           params: {id, auditStatus: 1} | ||||
|         }).then(res => { | ||||
|           if (res?.code == '0') { | ||||
|             this.$message.success("提交成功") | ||||
|             this.getTableData() | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("auditStatus", "category", "variety") | ||||
|     this.getTableData() | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <template> | ||||
|   <ai-page class="outList" :title="pageTitle"> | ||||
|     <ai-search-bar> | ||||
|       <template #left> | ||||
|         <ai-select placeholder="全部养殖场" v-model="search.farmId" :instance="instance" :action="`/api/siteUser/querySiteByUserId?userId=${userinfo.id}`" :prop="{label:'name'}"/> | ||||
|         <ai-select placeholder="全部养殖舍" v-model="search.houseId" :instance="instance" :action="`/api/siteUser/querySiteById?id=${search.farmId||-1}`" :prop="{label:'name'}"/> | ||||
|         <ai-select placeholder="全部养殖栏" v-model="search.penId" :instance="instance" :action="`/api/siteUser/querySiteById?id=${search.houseId||-1}`" :prop="{label:'name'}"/> | ||||
|         <ai-select placeholder="全部审核状态" v-model="search.auditStatus" dict="auditStatus"/> | ||||
|         <ai-search label="淘汰日期"> | ||||
|           <el-date-picker v-model="search.outBeginDate" type="datetime" placeholder="开始日期" size="small"/> | ||||
|           <el-date-picker v-model="search.outEndDate" type="datetime" placeholder="结束日期" size="small"/> | ||||
|         </ai-search> | ||||
|         <ai-search label="登记日期"> | ||||
|           <el-date-picker v-model="search.beginDate" type="datetime" placeholder="开始日期" size="small"/> | ||||
|           <el-date-picker v-model="search.endDate" type="datetime" placeholder="结束日期" size="small"/> | ||||
|         </ai-search> | ||||
|         <ai-input placeholder="原场耳标号" v-model="search.originalEarNumber"/> | ||||
|         <ai-input placeholder="生物芯片耳标号" v-model="search.biochipEarNumber"/> | ||||
|         <ai-input placeholder="电子耳标号" v-model="search.electronicEarNumber"/> | ||||
|       </template> | ||||
|     </ai-search-bar> | ||||
|     <ai-search-bar> | ||||
|       <template #left> | ||||
|         <el-button type="primary" icon="iconfont iconAdd" @click="$router.push({hash:'#add'})">新增</el-button> | ||||
|         <ai-download :instance="instance" url="/api/breed/out/export" :params="{...search,...page}" :fileName="`淘汰导出表-${Date.now()}`"/> | ||||
|       </template> | ||||
|     </ai-search-bar> | ||||
|     <ai-table :tableData="tableData" :colConfigs="columns" :dict="dict" @getList="getTableData" | ||||
|               :total="page.total" :current.sync="page.pageNum" :size.sync="page.pageSize"> | ||||
|       <el-table-column slot="options" label="操作" fixed="right" align="center"> | ||||
|         <template slot-scope="{row}"> | ||||
|           <div class="table-options"> | ||||
|  | ||||
|             <el-button v-if="row.auditStatus==1" type="text" @click="$router.push({hash:'#add',query:{id:row.biochipEarNumber}})">查看</el-button> | ||||
|             <template v-else> | ||||
|               <el-button v-if="row.auditStatus==2" type="text" @click="$router.push({hash:'#add',query:{id:row.biochipEarNumber}})">查看</el-button> | ||||
|               <el-button v-if="row.auditStatus==2" type="text" @click="$router.push({hash:'#add',query:{id:row.biochipEarNumber,edit:1}})">编辑</el-button> | ||||
|               <el-button v-if="row.auditStatus==3" type="text" @click="handleAuditAgain(row.id)">再次提交</el-button> | ||||
|               <el-button type="text" @click="handleDelete(row.id)">删除</el-button> | ||||
|             </template> | ||||
|           </div> | ||||
|         </template> | ||||
|       </el-table-column> | ||||
|     </ai-table> | ||||
|   </ai-page> | ||||
| </template> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .outList { | ||||
|   height: 100%; | ||||
|  | ||||
|   .deleteBtn { | ||||
|     color: $errorColor; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -140,7 +140,7 @@ export default { | ||||
|             <el-form-item label="治疗日期" prop="treatmentTime" :rules="{required:true,message:'请选择 治疗日期'}"> | ||||
|               <el-date-picker v-model="detail.treatmentTime"/> | ||||
|             </el-form-item> | ||||
|             <el-form-item v-for="item in formItems" v-bind="item"> | ||||
|             <el-form-item v-for="(item,i) in formItems" :key="i" v-bind="item"> | ||||
|               <ai-input v-model="detail[item.prop]"/> | ||||
|             </el-form-item> | ||||
|           </div> | ||||
|   | ||||
| @@ -5,7 +5,7 @@ import AiDialog from "dui/packages/basic/AiDialog.vue"; | ||||
|  | ||||
| const columns = [ | ||||
|   {label: "序号", type: "index"}, | ||||
|   {label: "数据来源", prop: "source", dict: "source"}, | ||||
|   {label: "数据来源", prop: "source", dict: "dataSources"}, | ||||
|   {label: "重量", prop: "weight"}, | ||||
|   {label: "称重时间", prop: "createTime"}, | ||||
|   {label: "是否变更过", prop: "isUpdate", dict: "yesOrNo"}, | ||||
| @@ -72,7 +72,7 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("yesOrNo", "category", "variety", "source") | ||||
|     this.dict.load("yesOrNo", "category", "variety", "dataSources") | ||||
|     this.getDetail() | ||||
|   } | ||||
| } | ||||
|   | ||||
		Reference in New Issue
	
	Block a user