基于JAVA宠物管理系统的设计与实现
生活随笔
收集整理的這篇文章主要介紹了
基于JAVA宠物管理系统的设计与实现
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
一、設(shè)計(jì)需求
本系統(tǒng)主要是由RFID自動(dòng)識(shí)別技術(shù)，通過無線射頻方式對(duì)寵物的電子標(biāo)簽進(jìn)行讀取，獲取寵物的基本信息和在店內(nèi)的所有消費(fèi)，然后將數(shù)據(jù)通過網(wǎng)絡(luò)傳輸至服務(wù)器。在應(yīng)用層開發(fā)一個(gè)管理系統(tǒng)，對(duì)寵物信息、店內(nèi)消費(fèi)等各種行為進(jìn)行管理。同時(shí)系統(tǒng)需有登錄注冊(cè)功能，寵物信息管理，店內(nèi)消費(fèi)管理等功能。
寵物店管理系統(tǒng)主要分為以下模塊:
1.RFID模塊:由天線和射頻電路組成，通過自動(dòng)識(shí)別電子標(biāo)簽，采集數(shù)據(jù)，采用RFID封裝技術(shù)將其封裝，并傳輸給服務(wù)器。
2.電子標(biāo)簽?zāi)K:接收外部信號(hào)和發(fā)送信號(hào)
3.店鋪管理模塊:管理員可以對(duì)店鋪商品進(jìn)行增刪改操作，修改、刪除顧客寵物信息以及店內(nèi)消費(fèi)行為。
4.登錄注冊(cè)模塊:新用戶可以進(jìn)行注冊(cè)和登錄5.用戶管理模塊:對(duì)注冊(cè)用戶進(jìn)行管理
二、設(shè)計(jì)需求總結(jié)
整個(gè)系統(tǒng)的設(shè)計(jì):?
(1). 寵物店每來一個(gè)新的寵物，就在軟件端進(jìn)行注冊(cè)、注冊(cè)時(shí)填入寵物的名稱，寵物的類型，主人的電話號(hào)碼、選擇一張寵物的圖片方便后面展示(圖片可以預(yù)存幾張貓、狗即可)、如果寵物后面在店里有消費(fèi)也會(huì)記錄包含時(shí)間，這些數(shù)據(jù)都保存在軟件端的數(shù)據(jù)庫(kù)里。
(2). 開卡:? 新寵物注冊(cè)之后，需要為這個(gè)寵物辦理一張電子標(biāo)簽卡，這個(gè)卡里存放著這個(gè)寵物主人的電話號(hào)碼，后面要查詢這個(gè)寵物的信息，就讀取整個(gè)電子標(biāo)簽里的電話號(hào)碼，到數(shù)據(jù)庫(kù)里查詢。
(3). 開卡和查詢的數(shù)據(jù)傳輸:? 設(shè)備端與軟件端采用 TCP網(wǎng)絡(luò)方式進(jìn)行通信；設(shè)備端當(dāng)做TCP客戶端，軟件端當(dāng)做TCP服務(wù)器；當(dāng)設(shè)備端查詢寵物的電子標(biāo)簽時(shí)，設(shè)備端讀取電話號(hào)碼之后，會(huì)通過約定的數(shù)據(jù)格式通過網(wǎng)絡(luò)傳遞給軟件端。 當(dāng)軟件端開卡注冊(cè)時(shí)，也會(huì)用約定好的數(shù)據(jù)格式傳遞給設(shè)備端，如果設(shè)備端收到數(shù)據(jù)，開發(fā)板上的LED會(huì)點(diǎn)亮；這時(shí)把IC拿到RC522射頻模塊上刷一下即可；如果成功寫入LED燈就會(huì)關(guān)閉。
(4). 軟件端的設(shè)計(jì)(這個(gè)軟件是給店家用的，功能都是針對(duì)店家這邊方向開發(fā)):
有注冊(cè)界面、登錄界面；
主界面上顯示店內(nèi)有所有注冊(cè)過的寵物信息，每個(gè)寵物有圖片進(jìn)行顯示、寵物圖片下面就顯示寵物的名稱；
商品界面:? 展示一些狗糧、貓糧、藥劑、一些寵物周邊物品。 用于演示消費(fèi)功能。 可以預(yù)定幾個(gè)商品即可。 用戶可以自己動(dòng)態(tài)添加修改。
管理員界面: 可以對(duì)店內(nèi)的商品進(jìn)行添加、設(shè)計(jì)價(jià)格、修改寵物的信息等。
查詢頁(yè)面: 輸入寵物信息可以查詢這個(gè)寵物在店里的所有詳細(xì)信息。
設(shè)備硬件部分:
這里的硬件刷卡部分采用的使用STM32開發(fā)的，更加靈活方便，完成對(duì)IC卡讀寫通過網(wǎng)絡(luò)與JAVA服務(wù)器通信，也可以換成掃碼槍之類的其他設(shè)備。
1.? ?RC522刷卡模塊負(fù)責(zé)對(duì)卡進(jìn)行讀寫。
2.? ?ESP8266WIFI初始化工作在STA模式，連接到指定WIFI，與軟件所在的電腦處于同一個(gè)局域網(wǎng)，方便連接軟件端的服務(wù)器進(jìn)行數(shù)據(jù)通信，每次設(shè)備開機(jī)將會(huì)自動(dòng)連接到程序里設(shè)置好WIFI熱點(diǎn)和服務(wù)器。
3.?? ?設(shè)備端上有一個(gè)LED燈，用來顯示刷卡的狀態(tài)—成功與否。
?
完整資料包下載地址:?https://download.csdn.net/download/xiaolong1126626497/20687600
三、硬件設(shè)備效果圖與部分核心代碼
?
?
?
#include "esp8266.h" u8 ESP8266_IP_ADDR[16]; //255.255.255.255 u8 ESP8266_MAC_ADDR[18]; //硬件地址 /* 函數(shù)功能: ESP8266命令發(fā)送函數(shù) 函數(shù)返回值:0表示成功 1表示失敗 */ u8 ESP8266_SendCmd(char *cmd) {u8 i,j;for(i=0;i<10;i++) //檢測(cè)的次數(shù)--發(fā)送指令的次數(shù){USARTx_StringSend(USART3,cmd);for(j=0;j<100;j++) //等待的時(shí)間{delay_ms(50);if(USART3_RX_FLAG){USART3_RX_BUFFER[USART3_RX_CNT]='\0';USART3_RX_FLAG=0;USART3_RX_CNT=0;if(strstr((char*)USART3_RX_BUFFER,"OK")){return 0;}}}}return 1; }/* 函數(shù)功能: ESP8266硬件初始化檢測(cè)函數(shù) 函數(shù)返回值:0表示成功 1表示失敗 */ u8 ESP8266_Init(void) {//退出透?jìng)髂Ｊ経SARTx_StringSend(USART3,"+++");delay_ms(50);return ESP8266_SendCmd("AT\r\n"); }/* 函數(shù)功能: 一鍵配置WIFI為AP+TCP服務(wù)器模式 函數(shù)參數(shù): char *ssid 創(chuàng)建的熱點(diǎn)名稱 char *pass 創(chuàng)建的熱點(diǎn)密碼 （最少8位） u16 port 創(chuàng)建的服務(wù)器端口號(hào) 函數(shù)返回值: 0表示成功 其他值表示對(duì)應(yīng)錯(cuò)誤值 */ u8 ESP8266_AP_TCP_Server_Mode(char *ssid,char *pass,u16 port) {char *p;u8 i;char ESP8266_SendCMD[100]; //組合發(fā)送過程中的命令/*1. 測(cè)試硬件*/if(ESP8266_SendCmd("AT\r\n"))return 1;/*2. 關(guān)閉回顯*/if(ESP8266_SendCmd("ATE0\r\n"))return 2;/*3. 設(shè)置WIFI模式*/if(ESP8266_SendCmd("AT+CWMODE=2\r\n"))return 3;/*4. 復(fù)位*/ESP8266_SendCmd("AT+RST\r\n");delay_ms(1000);delay_ms(1000);delay_ms(1000);/*5. 關(guān)閉回顯*/if(ESP8266_SendCmd("ATE0\r\n"))return 5;/*6. 設(shè)置WIFI的AP模式參數(shù)*/sprintf(ESP8266_SendCMD,"AT+CWSAP=\"%s\",\"%s\",1,4\r\n",ssid,pass);if(ESP8266_SendCmd(ESP8266_SendCMD))return 6;/*7. 開啟多連接*/if(ESP8266_SendCmd("AT+CIPMUX=1\r\n"))return 7;/*8. 設(shè)置服務(wù)器端口號(hào)*/sprintf(ESP8266_SendCMD,"AT+CIPSERVER=1,%d\r\n",port);if(ESP8266_SendCmd(ESP8266_SendCMD))return 8;/*9. 查詢本地IP地址*/if(ESP8266_SendCmd("AT+CIFSR\r\n"))return 9;//提取IP地址p=strstr((char*)USART3_RX_BUFFER,"APIP");if(p){p+=6;for(i=0;*p!='"';i++){ESP8266_IP_ADDR[i]=*p++;}ESP8266_IP_ADDR[i]='\0';}//提取MAC地址p=strstr((char*)USART3_RX_BUFFER,"APMAC");if(p){p+=7;for(i=0;*p!='"';i++){ESP8266_MAC_ADDR[i]=*p++;}ESP8266_MAC_ADDR[i]='\0';}//打印總體信息USART1_Printf("當(dāng)前WIFI模式:AP+TCP服務(wù)器\n");USART1_Printf("當(dāng)前WIFI熱點(diǎn)名稱:%s\n",ssid);USART1_Printf("當(dāng)前WIFI熱點(diǎn)密碼:%s\n",pass);USART1_Printf("當(dāng)前TCP服務(wù)器端口號(hào):%d\n",port);USART1_Printf("當(dāng)前TCP服務(wù)器IP地址:%s\n",ESP8266_IP_ADDR);USART1_Printf("當(dāng)前TCP服務(wù)器MAC地址:%s\n",ESP8266_MAC_ADDR);return 0; }/* 函數(shù)功能: TCP服務(wù)器模式下的發(fā)送函數(shù) 發(fā)送指令: */ u8 ESP8266_ServerSendData(u8 id,u8 *data,u16 len) {u8 i,j,n;char ESP8266_SendCMD[100]; //組合發(fā)送過程中的命令for(i=0;i<10;i++){sprintf(ESP8266_SendCMD,"AT+CIPSEND=%d,%d\r\n",id,len);USARTx_StringSend(USART3,ESP8266_SendCMD);for(j=0;j<10;j++){delay_ms(50);if(USART3_RX_FLAG){USART3_RX_BUFFER[USART3_RX_CNT]='\0';USART3_RX_FLAG=0;USART3_RX_CNT=0;if(strstr((char*)USART3_RX_BUFFER,">")){//繼續(xù)發(fā)送數(shù)據(jù)USARTx_DataSend(USART3,data,len);//等待數(shù)據(jù)發(fā)送成功for(n=0;n<200;n++){delay_ms(50);if(USART3_RX_FLAG){USART3_RX_BUFFER[USART3_RX_CNT]='\0';USART3_RX_FLAG=0;USART3_RX_CNT=0;if(strstr((char*)USART3_RX_BUFFER,"SEND OK")){return 0;}} } }}}}return 1; }/* 函數(shù)功能: 配置WIFI為STA模式+TCP客戶端模式 函數(shù)參數(shù): char *ssid 創(chuàng)建的熱點(diǎn)名稱 char *pass 創(chuàng)建的熱點(diǎn)密碼 （最少8位） char *p 將要連接的服務(wù)器IP地址 u16 port 將要連接的服務(wù)器端口號(hào) u8 flag 1表示開啟透?jìng)髂Ｊ?0表示關(guān)閉透?jìng)髂Ｊ?函數(shù)返回值:0表示成功 其他值表示對(duì)應(yīng)的錯(cuò)誤 */ u8 ESP8266_STA_TCP_Client_Mode(char *ssid,char *pass,char *ip,u16 port,u8 flag) {char ESP8266_SendCMD[100]; //組合發(fā)送過程中的命令//退出透?jìng)髂Ｊ?/USARTx_StringSend(USART3,"+++");//delay_ms(50);/*1. 測(cè)試硬件*/if(ESP8266_SendCmd("AT\r\n"))return 1;/*2. 關(guān)閉回顯*/if(ESP8266_SendCmd("ATE0\r\n"))return 2;/*3. 設(shè)置WIFI模式*/if(ESP8266_SendCmd("AT+CWMODE=1\r\n"))return 3;/*4. 復(fù)位*/ESP8266_SendCmd("AT+RST\r\n");delay_ms(1000);delay_ms(1000);delay_ms(1000);/*5. 關(guān)閉回顯*/if(ESP8266_SendCmd("ATE0\r\n"))return 5;/*6. 配置將要連接的WIFI熱點(diǎn)信息*/sprintf(ESP8266_SendCMD,"AT+CWJAP=\"%s\",\"%s\"\r\n",ssid,pass);if(ESP8266_SendCmd(ESP8266_SendCMD))return 6;/*7. 設(shè)置單連接*/if(ESP8266_SendCmd("AT+CIPMUX=0\r\n"))return 7;/*8. 配置要連接的TCP服務(wù)器信息*/sprintf(ESP8266_SendCMD,"AT+CIPSTART=\"TCP\",\"%s\",%d\r\n",ip,port);if(ESP8266_SendCmd(ESP8266_SendCMD))return 8;/*9. 開啟透?jìng)髂Ｊ?/if(flag){if(ESP8266_SendCmd("AT+CIPMODE=1\r\n"))return 9; //開啟if(ESP8266_SendCmd("AT+CIPSEND\r\n"))return 10; //開始透?jìng)鱥f(!(strstr((char*)USART3_RX_BUFFER,">"))){return 11;}//如果想要退出發(fā)送: "+++"}//打印總體信息USART1_Printf("當(dāng)前WIFI模式:STA+TCP客戶端\n");USART1_Printf("當(dāng)前連接的WIFI熱點(diǎn)名稱:%s\n",ssid);USART1_Printf("當(dāng)前連接的WIFI熱點(diǎn)密碼:%s\n",pass);USART1_Printf("當(dāng)前連接的TCP服務(wù)器端口號(hào):%d\n",port);USART1_Printf("當(dāng)前連接的TCP服務(wù)器IP地址:%s\n",ip);return 0; }/* 函數(shù)功能: TCP客戶端模式下的發(fā)送函數(shù) 發(fā)送指令: */ u8 ESP8266_ClientSendData(u8 *data,u16 len) {u8 i,j,n;char ESP8266_SendCMD[100]; //組合發(fā)送過程中的命令for(i=0;i<10;i++){sprintf(ESP8266_SendCMD,"AT+CIPSEND=%d\r\n",len);USARTx_StringSend(USART3,ESP8266_SendCMD);for(j=0;j<10;j++){delay_ms(50);if(USART3_RX_FLAG){USART3_RX_BUFFER[USART3_RX_CNT]='\0';USART3_RX_FLAG=0;USART3_RX_CNT=0;if(strstr((char*)USART3_RX_BUFFER,">")){//繼續(xù)發(fā)送數(shù)據(jù)USARTx_DataSend(USART3,data,len);//等待數(shù)據(jù)發(fā)送成功for(n=0;n<200;n++){delay_ms(50);if(USART3_RX_FLAG){USART3_RX_BUFFER[USART3_RX_CNT]='\0';USART3_RX_FLAG=0;USART3_RX_CNT=0;if(strstr((char*)USART3_RX_BUFFER,"SEND OK")){return 0;}} } }}}}return 1; }四、JAVA端效果圖與部分代碼示例
完整資料包下載地址:?https://download.csdn.net/download/xiaolong1126626497/20687600
?
?
?
?
?
?
?
?
?
?
?
?
?
package com.controller;import java.util.List; import java.util.Map;import javax.servlet.http.HttpSession;import org.springframework.beans.factory.annotation.Autowired; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestBody; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RestController;import com.common.bean.MySessionContext; import com.common.bean.ResultData; import com.entity.User; import com.mapper.UserMapper;@RestController() @RequestMapping("/user") public class UserController {@Autowiredprivate UserMapper um;@PostMapping("changepswd.action")ResultData changePswd(String token,@RequestBody Map<String,String> map) {HttpSession ss = MySessionContext.getSession( token );if( ss == null ) {return ResultData.fail("請(qǐng)先登錄！");}User uu = (User) ss.getAttribute("login_user");if( uu == null ) return ResultData.fail("請(qǐng)先登錄！");String password = map.get("password");String newpassword = map.get("password2");int num = um.updatePassword(uu.getId(), password, newpassword);if( num > 0) return ResultData.success();return ResultData.fail("原始密碼錯(cuò)誤");}@PostMapping("adduser.action")ResultData addUser(String token,@RequestBody User user) {HttpSession ss = MySessionContext.getSession( token );if( ss == null ) {return ResultData.fail("請(qǐng)先登錄！");}User uu = (User) ss.getAttribute("login_user");System.out.println( uu );if( uu == null ) return ResultData.fail("請(qǐng)先登錄！");if( !("admin".equalsIgnoreCase(uu.getRole()) ||"root".equals( uu.getRole() ) ) ) {return ResultData.fail("請(qǐng)用管理員賬號(hào)登錄再添加");}um.addUser(user);return ResultData.success();}@PostMapping("delete.action")ResultData deleteUser(String token,@RequestBody User user) {System.out.println( user);HttpSession ss = MySessionContext.getSession( token );if( ss == null ) {return ResultData.fail("請(qǐng)先登錄！");}User uu = (User) ss.getAttribute("login_user");if( uu == null ) return ResultData.fail("請(qǐng)先登錄！");if("admin".equalsIgnoreCase(user.getRole()) || "root".equals( user.getRole() )) return ResultData.fail("無法刪除管理員用戶！");if( !("admin".equalsIgnoreCase(uu.getRole()) ||"root".equals( uu.getRole() ) ) ) {return ResultData.fail("請(qǐng)用管理員賬號(hào)登錄再刪除");}um.deleteUser(user);return ResultData.success();}@PostMapping("getall.action")ResultData getAll(String token) {HttpSession ss = MySessionContext.getSession( token );if( ss == null ) {return ResultData.fail("請(qǐng)先登錄！");}List<User> list = um.getAll();for(User u:list) {u.setPassword(null);}return ResultData.success().setData( list );}@PostMapping("logout.action")ResultData getAllUser(String token) {HttpSession ss = MySessionContext.getSession( token );if( ss != null ) {ss.invalidate();}return ResultData.success();}@PostMapping("login.action")ResultData login(@RequestBody User user,HttpSession ss) {User rs = um.Login( user );if(rs != null ) {rs.setPassword( null );ss.setAttribute("login_user", rs );MySessionContext.AddSession( ss );return ResultData.success().setData( rs ).setToken(ss.getId() );}else {return ResultData.fail("用戶名或密碼錯(cuò)誤！");}}}?
package com.common.wx;import org.springframework.web.socket.WebSocketSession; import org.springframework.web.socket.handler.TextWebSocketHandler;import com.common.bean.WebSocketProductHolder;public class WebSocketServerService extends TextWebSocketHandler{@Overridepublic void afterConnectionEstablished(WebSocketSession session) throws Exception {WebSocketProductHolder.setSession( session );}}?
package com.common.bean; import java.io.IOException; import java.net.ServerSocket; import java.net.Socket;import org.springframework.beans.BeansException; import org.springframework.context.ApplicationContext; import org.springframework.context.ApplicationContextAware; import org.springframework.stereotype.Component; import org.springframework.web.socket.TextMessage; import org.springframework.web.socket.WebSocketSession;import com.alibaba.fastjson.JSONObject; import com.entity.Product; import com.mapper.ProductMapper;@Component public class WebSocketProductHolder implements ApplicationContextAware{private volatile static WebSocketSession oneSession;private volatile static Socket client;public WebSocketProductHolder() {initServer();}public static void setSession(WebSocketSession ss) {oneSession = ss;}private static void initServer() {new Thread() {public void run() {ServerSocket ss = null;try {ss = new ServerSocket(9988);System.out.println("初始化");while(true) {client = ss.accept();byte [] b = new byte[128];try {while(true) {int num = client.getInputStream().read(b);//數(shù)據(jù)少，一次讀完就阻塞。if(num != -1 ) {String cmd = new String(b,0,num);parseCMD( cmd);}}}catch (Exception e) {System.out.println("連接斷開...");}}}catch (Exception e) {}}}.start();}public static void register(String cardid)throws IOException {if(cardid!=null && cardid.length() >0 && client!=null && client.isConnected()) {client.getOutputStream().write(("register:"+cardid+"\r\n").getBytes());}}private static void parseCMD(String cmd) {if(cmd.startsWith("query")) {try {String cardid = cmd.split(":")[1].trim();if( oneSession != null ) {oneSession.sendMessage( new TextMessage( cardid ) );} }catch (Exception e) {System.out.println("數(shù)據(jù)錯(cuò)誤："+cmd);}}}@Overridepublic void setApplicationContext(ApplicationContext applicationContext) throws BeansException {initServer();} }?
<template><view><Menu></Menu><view class="view_content mc" ><view style="width:400px;"><view class="commonrow v_center"><text class="simpletitle">商品名稱</text><uni-easyinput v-model="addModel.name" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品價(jià)格</text><uni-easyinput type="number" v-model="addModel.price" placeholder="單位為分,例如,16元請(qǐng)?zhí)顚?600" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品數(shù)量</text><uni-easyinput type="number" v-model="addModel.num" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品分類</text><uni-easyinput v-model="addModel.sortname" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品描述</text><uni-easyinput type="textarea" v-model="addModel.detail" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品圖片</text><uni-upload-one-image v-model="addModel.imgurl" /></view><view class="commonrow v_center mt_5"><text class="simpletitle"></text><text class="submitbtn hand_point" @click="submit">提交</text></view></view></view></view> </template><script> import Menu from '@/pages/common/Menu.vue' export default {components:{Menu},data() {return {addModel:{}}},methods: {async submit(){if(!this.addModel.name){return this.$api.alert("請(qǐng)?zhí)顚懮唐访Q！");}if(!this.addModel.price){return this.$api.alert("請(qǐng)?zhí)顚懮唐穬r(jià)格！");}if(!this.addModel.num){return this.$api.alert("請(qǐng)?zhí)顚懮唐窋?shù)量！");}if(!this.addModel.sortname){return this.$api.alert("請(qǐng)?zhí)顚懮唐贩诸?#xff01;");}if(!this.addModel.detail){return this.$api.alert("請(qǐng)?zhí)顚懮唐访枋?#xff01;");}if(!this.addModel.imgurl){return this.$api.alert("請(qǐng)?zhí)钌蟼魃唐穲D片！");}console.info( this.addModel );let res = await this.$api.request("product/add.action",this.addModel);console.info( res );this.$api.alert("添加成功！");}} } </script><style></style>?
<template><view><Menu></Menu><view class="view_content mc"><view v-show="mode=='query'"><view class="commonrow h_center" style="width:600px;"><uni-easyinput v-model="query.id" placeholder="請(qǐng)輸入商品編號(hào)" /><uni-easyinput v-model="query.name"placeholder="請(qǐng)輸入商品名稱" class="ml_10" /><text class="submitbtn ml_10" @click="queryPro">查詢</text></view><view class="up_down_content h_center commonrow">當(dāng)前共 {{datalist.length}} 件商品</view><uni-table border stripe emptyText="暫無更多數(shù)據(jù)" type="checkbox" style="width:100%;max-height: 700px;overflow: auto;"><!-- 表頭行 --><uni-tr><uni-th align="center" width="150">商品編號(hào)</uni-th><uni-th align="center" width="150">商品名稱</uni-th><uni-th align="left" width="150">商品分類</uni-th><uni-th align="left" width="100">商品價(jià)格</uni-th><uni-th align="left" width="100">商品數(shù)量</uni-th><uni-th align="left" width="100">商品圖片</uni-th><uni-th align="left" >操作</uni-th></uni-tr><uni-tr v-for="(item , index ) in datalist" style="width: 100%;" ><uni-td align="center" > <uni-easyinput v-model="item.id" :disabled="true" /></uni-td><uni-td align="center" >{{item.name}}</uni-td><uni-td>{{item.sortname}}</uni-td><uni-td>{{item.price|priceText}}</uni-td><uni-td>{{item.num}}</uni-td><uni-td><uni-img :src="item.imgurl"></uni-img></uni-td><uni-td><view class="commonrow"><text class="submitbtn hand_point" @click="showdetail(item)">詳情</text><text class="deletebtn hand_point ml_10" @click="del(item)">刪除</text><text class="submitbtn hand_point ml_10" @click="edit(item)">修改</text></view></uni-td></uni-tr></uni-table></view><view v-show="mode=='detail'" style="padding-left: 50px;"><view class="commonrow"><text class="cancelbtn" @click="mode='query';">返回</text></view><view class="commonrow v_center" style="margin-top: 30px;"><text class="simpletitle">商品編號(hào)</text>{{detail.id}}</view><view class="commonrow v_center mt_5"><text class="simpletitle">商品名稱</text>{{detail.name}}</view><view class="commonrow v_center mt_5"><text class="simpletitle">商品價(jià)格</text>{{detail.price|priceText}}</view><view class="commonrow v_center mt_5"><text class="simpletitle">商品數(shù)量</text>{{detail.num}}</view><view class="commonrow v_center mt_5"><text class="simpletitle">商品分類</text>{{detail.sortname}}</view><view class="commonrow v_center mt_5"><text class="simpletitle">商品描述</text>{{detail.detail}}</view><view class="commonrow v_center mt_5"><text class="simpletitle">商品圖片</text><uni-img :src="detail.imgurl"></uni-img></view></view></view></view> </template><script> import Menu from '@/pages/common/Menu.vue' export default {components:{Menu},data() {return {query:{},datalist:[],detail:{},mode:"query"}},onLoad() {this.load();},methods: {showdetail( item ){this.mode = "detail";this.detail = item;},async edit(item){this.navTo("/pages/product/update?id="+item.id);},async queryPro(){if(!this.query.id)delete this.query.id;if(!this.query.name)delete this.query.name;if(this.query.id){this.query.id = Number(this.query.id);}let res = await this.$api.request("product/query.action",this.query);this.datalist = res.data;},async load(){let res = await this.$api.request("product/all.action");this.datalist = res.data;},del(item){this.$api.confirm(async ()=>{let res = await this.$api.request("product/delete.action",item);this.$api.alert("刪除成功！");await this.load();},"刪除后不可恢復(fù)，確認(rèn)刪除嗎？")}} } </script><style></style> <template><view><Menu></Menu><view class="view_content mc" ><view style="width:400px;" v-if="model"><view class="commonrow v_center"><text class="simpletitle">商品名稱</text><uni-easyinput v-model="model.name" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品價(jià)格</text><uni-easyinput type="number" v-model="model.price" placeholder="單位為分,例如,16元請(qǐng)?zhí)顚?600" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品數(shù)量</text><uni-easyinput type="number" v-model="model.num" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品分類</text><uni-easyinput v-model="model.sortname" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品描述</text><uni-easyinput type="textarea" v-model="model.detail" /></view><view class="commonrow v_center mt_5"><text class="simpletitle">商品圖片</text><uni-upload-one-image v-model="model.imgurl" /></view><view class="commonrow v_center mt_5"><text class="simpletitle"></text><text class="submitbtn hand_point" @click="submit">提交</text></view></view></view></view> </template><script> import Menu from '@/pages/common/Menu.vue' export default {components:{Menu},data() {return {model:null}},onLoad({id}){if(!id)return this.$api.alert("參數(shù)錯(cuò)誤！");this.loadProduct(id);},methods: {async loadProduct(id){let res = await this.$api.request("product/byid.action",{id});if(res.data ){this.model = res.data;}console.info(this.model);},async submit(){if(!this.model.name){return this.$api.alert("請(qǐng)?zhí)顚懮唐访Q！");}if(!this.model.price){return this.$api.alert("請(qǐng)?zhí)顚懮唐穬r(jià)格！");}if(!this.model.num){return this.$api.alert("請(qǐng)?zhí)顚懮唐窋?shù)量！");}if(!this.model.sortname){return this.$api.alert("請(qǐng)?zhí)顚懮唐贩诸?#xff01;");}if(!this.model.detail){return this.$api.alert("請(qǐng)?zhí)顚懮唐访枋?#xff01;");}if(!this.model.imgurl){return this.$api.alert("請(qǐng)?zhí)钌蟼魃唐穲D片！");}console.info( this.model );let res = await this.$api.request("product/update.action",this.model);this.$api.alert("修改成功！");this.navTo("/pages/product/search");}} } </script><style></style>總結(jié)
以上是生活随笔為你收集整理的基于JAVA宠物管理系统的设计与实现的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： jsp 连接MS server 数据库的
- 下一篇： Java毕设项目宠物管理系统计算机（附源