20个文件已修改
3 文件已重命名
25个文件已添加
8个文件已删除
| New file |
| | |
|---|
| | | <%@ page contentType="text/html;charset=UTF-8"%> |
|---|
| | | |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
|---|
| | | |
|---|
| | | <style> |
|---|
| | | html,body{ |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | #header { |
|---|
| | | width: 100%; |
|---|
| | | height: 30%; |
|---|
| | | background-color: white; |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | #footer { |
|---|
| | | width: 100%; |
|---|
| | | height: 70%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #main1 { |
|---|
| | | width: 15%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | #main2 { |
|---|
| | | width: 20%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | #main4 { |
|---|
| | | width: 20%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | #main3 { |
|---|
| | | width: 45%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | #main1-1 { |
|---|
| | | width: 100%; |
|---|
| | | height: 50%; |
|---|
| | | } |
|---|
| | | #main1-2 { |
|---|
| | | width: 100%; |
|---|
| | | height: 50%; |
|---|
| | | } |
|---|
| | | #main3-1 { |
|---|
| | | width: 50%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | #main3-2 { |
|---|
| | | width: 50%; |
|---|
| | | height: 100%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #main4-1 { |
|---|
| | | width: 100%; |
|---|
| | | height: 30%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #main4-2 { |
|---|
| | | width: 100%; |
|---|
| | | height: 30%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #main4-3 { |
|---|
| | | width: 100%; |
|---|
| | | height: 30%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #main1-1-1 { |
|---|
| | | font-size: 35px; |
|---|
| | | margin-top: 10%; |
|---|
| | | } |
|---|
| | | #main1-2-1 { |
|---|
| | | font-size: 35px; |
|---|
| | | margin-top: 10%; |
|---|
| | | } |
|---|
| | | #main3-1-1 { |
|---|
| | | width: 100%; |
|---|
| | | height: 20%; |
|---|
| | | } |
|---|
| | | #main3-1-2 { |
|---|
| | | width: 100%; |
|---|
| | | height: 80%; |
|---|
| | | } |
|---|
| | | #main3-2-1 { |
|---|
| | | width: 100%; |
|---|
| | | height: 20%; |
|---|
| | | } |
|---|
| | | #main3-2-2 { |
|---|
| | | width: 100%; |
|---|
| | | height: 80%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | .boli { |
|---|
| | | opacity:0.5; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #cangchu { |
|---|
| | | width: 75px; |
|---|
| | | height: 25px; |
|---|
| | | position: absolute; |
|---|
| | | top: 820px; |
|---|
| | | left: 1507px; |
|---|
| | | } |
|---|
| | | /* -45 |
|---|
| | | -50 |
|---|
| | | */ |
|---|
| | | #A4 { |
|---|
| | | width: 65px; |
|---|
| | | height: 55px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 775px; |
|---|
| | | left: 1250px |
|---|
| | | } |
|---|
| | | #A7 { |
|---|
| | | width: 15px; |
|---|
| | | height: 45px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 785px; |
|---|
| | | left: 1185px |
|---|
| | | } |
|---|
| | | #A9 { |
|---|
| | | width: 15px; |
|---|
| | | height: 45px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 785px; |
|---|
| | | left: 1139px |
|---|
| | | } |
|---|
| | | #A10 { |
|---|
| | | width: 15px; |
|---|
| | | height: 45px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 840px; |
|---|
| | | left: 1139px |
|---|
| | | } |
|---|
| | | #A11 { |
|---|
| | | width: 15px; |
|---|
| | | height: 45px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 840px; |
|---|
| | | left: 1185px |
|---|
| | | } |
|---|
| | | #A14 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 922px; |
|---|
| | | left: 1140px |
|---|
| | | } |
|---|
| | | #A15 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 922px; |
|---|
| | | left: 1183px |
|---|
| | | } |
|---|
| | | #A16 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 951px; |
|---|
| | | left: 1183px |
|---|
| | | } |
|---|
| | | #A17 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | position: Absolute; |
|---|
| | | top: 951px; |
|---|
| | | left: 1163px |
|---|
| | | } |
|---|
| | | #A18 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 951px; |
|---|
| | | left: 1140px |
|---|
| | | } |
|---|
| | | #A20 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 951px; |
|---|
| | | left: 1122px |
|---|
| | | } |
|---|
| | | #A21 { |
|---|
| | | width: 45px; |
|---|
| | | height: 65px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 918px; |
|---|
| | | left: 1075px; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #A22 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 953px; |
|---|
| | | left: 1061px; |
|---|
| | | } |
|---|
| | | #A23 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 953px; |
|---|
| | | left: 1047px; |
|---|
| | | } |
|---|
| | | #A24 { |
|---|
| | | width: 45px; |
|---|
| | | height: 65px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 918px; |
|---|
| | | left: 1000px; |
|---|
| | | } |
|---|
| | | #A25 { |
|---|
| | | width: 35px; |
|---|
| | | height: 50px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 932px; |
|---|
| | | left: 945px; |
|---|
| | | } |
|---|
| | | #A26 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 953px; |
|---|
| | | left: 926px; |
|---|
| | | } |
|---|
| | | #A28 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 953px; |
|---|
| | | left: 912px; |
|---|
| | | } |
|---|
| | | #A29 { |
|---|
| | | width: 25px; |
|---|
| | | height: 25px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 949px; |
|---|
| | | left: 885px; |
|---|
| | | } |
|---|
| | | #A30 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 871px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | #A31 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 851px; |
|---|
| | | } |
|---|
| | | #A32 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 832px; |
|---|
| | | } |
|---|
| | | #A33 { |
|---|
| | | width: 22px; |
|---|
| | | height: 52px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 923px; |
|---|
| | | left: 804px; |
|---|
| | | } |
|---|
| | | #A34 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 956px; |
|---|
| | | left: 775px; |
|---|
| | | } |
|---|
| | | #A35 { |
|---|
| | | width: 57px; |
|---|
| | | height: 55px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 920px; |
|---|
| | | left: 705px; |
|---|
| | | } |
|---|
| | | #A37 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 956px; |
|---|
| | | left: 680px; |
|---|
| | | } |
|---|
| | | #A38 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 956px; |
|---|
| | | left: 642px; |
|---|
| | | } |
|---|
| | | #A39 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 956px; |
|---|
| | | left: 606px; |
|---|
| | | } |
|---|
| | | #A40 { |
|---|
| | | width: 37px; |
|---|
| | | height: 44px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 931px; |
|---|
| | | left: 556px; |
|---|
| | | } |
|---|
| | | #A41 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 538px; |
|---|
| | | } |
|---|
| | | #A42 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 517px; |
|---|
| | | } |
|---|
| | | #B31 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 884px; |
|---|
| | | left: 850px; |
|---|
| | | } |
|---|
| | | #B32 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 884px; |
|---|
| | | left: 832px; |
|---|
| | | } |
|---|
| | | #B33 { |
|---|
| | | width: 22px; |
|---|
| | | height: 52px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 853px; |
|---|
| | | left: 804px; |
|---|
| | | } |
|---|
| | | #B34 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 886px; |
|---|
| | | left: 775px; |
|---|
| | | } |
|---|
| | | #B35 { |
|---|
| | | width: 57px; |
|---|
| | | height: 55px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 850px; |
|---|
| | | left: 705px; |
|---|
| | | } |
|---|
| | | #B37 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 886px; |
|---|
| | | left: 680px; |
|---|
| | | } |
|---|
| | | #B38 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 886px; |
|---|
| | | left: 642px; |
|---|
| | | } |
|---|
| | | #B39 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 886px; |
|---|
| | | left: 606px; |
|---|
| | | } |
|---|
| | | #B40 { |
|---|
| | | width: 37px; |
|---|
| | | height: 44px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 861px; |
|---|
| | | left: 556px; |
|---|
| | | } |
|---|
| | | #B41 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 884px; |
|---|
| | | left: 538px; |
|---|
| | | } |
|---|
| | | #B42 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 884px; |
|---|
| | | left: 517px; |
|---|
| | | } |
|---|
| | | #C31 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 814px; |
|---|
| | | left: 850px; |
|---|
| | | } |
|---|
| | | #C32 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 814px; |
|---|
| | | left: 832px; |
|---|
| | | } |
|---|
| | | #C33 { |
|---|
| | | width: 22px; |
|---|
| | | height: 52px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 785px; |
|---|
| | | left: 804px; |
|---|
| | | } |
|---|
| | | #C34 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 817px; |
|---|
| | | left: 775px; |
|---|
| | | } |
|---|
| | | #C35 { |
|---|
| | | width: 57px; |
|---|
| | | height: 55px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 780px; |
|---|
| | | left: 705px; |
|---|
| | | } |
|---|
| | | #C37 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 817px; |
|---|
| | | left: 680px; |
|---|
| | | } |
|---|
| | | #C38 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 817px; |
|---|
| | | left: 642px; |
|---|
| | | } |
|---|
| | | #C39 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 817px; |
|---|
| | | left: 606px; |
|---|
| | | } |
|---|
| | | #C40 { |
|---|
| | | width: 37px; |
|---|
| | | height: 44px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 791px; |
|---|
| | | left: 556px; |
|---|
| | | } |
|---|
| | | #C41 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 814px; |
|---|
| | | left: 538px; |
|---|
| | | } |
|---|
| | | #C42 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 814px; |
|---|
| | | left: 517px; |
|---|
| | | } |
|---|
| | | #D31 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 746px; |
|---|
| | | left: 850px; |
|---|
| | | } |
|---|
| | | #D32 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 746px; |
|---|
| | | left: 832px; |
|---|
| | | } |
|---|
| | | #D33 { |
|---|
| | | width: 22px; |
|---|
| | | height: 52px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 715px; |
|---|
| | | left: 804px; |
|---|
| | | } |
|---|
| | | #D34 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 748px; |
|---|
| | | left: 775px; |
|---|
| | | } |
|---|
| | | #D35 { |
|---|
| | | width: 57px; |
|---|
| | | height: 55px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 711px; |
|---|
| | | left: 705px; |
|---|
| | | } |
|---|
| | | #D37 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 748px; |
|---|
| | | left: 680px; |
|---|
| | | } |
|---|
| | | #D38 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 748px; |
|---|
| | | left: 642px; |
|---|
| | | } |
|---|
| | | #D39 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 748px; |
|---|
| | | left: 606px; |
|---|
| | | } |
|---|
| | | #D40 { |
|---|
| | | width: 37px; |
|---|
| | | height: 44px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 723px; |
|---|
| | | left: 556px; |
|---|
| | | } |
|---|
| | | #D41 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 746px; |
|---|
| | | left: 538px; |
|---|
| | | } |
|---|
| | | #D42 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 746px; |
|---|
| | | left: 517px; |
|---|
| | | } |
|---|
| | | #s1 { |
|---|
| | | width: 15px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 906px; |
|---|
| | | left: 850px; |
|---|
| | | } |
|---|
| | | #s2 { |
|---|
| | | width: 15px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 838px; |
|---|
| | | left: 850px; |
|---|
| | | } |
|---|
| | | #s3 { |
|---|
| | | width: 15px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 769px; |
|---|
| | | left: 850px; |
|---|
| | | } |
|---|
| | | #s6 { |
|---|
| | | width: 15px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 906px; |
|---|
| | | left: 515px; |
|---|
| | | } |
|---|
| | | #s5 { |
|---|
| | | width: 15px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 838px; |
|---|
| | | left: 515px; |
|---|
| | | } |
|---|
| | | #s4 { |
|---|
| | | width: 15px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 769px; |
|---|
| | | left: 515px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #A43 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 498px; |
|---|
| | | } |
|---|
| | | #A44 { |
|---|
| | | width: 190px; |
|---|
| | | height: 26px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 949px; |
|---|
| | | left: 297px; |
|---|
| | | } |
|---|
| | | #A45 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 277px; |
|---|
| | | } |
|---|
| | | #A47 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 258px; |
|---|
| | | } |
|---|
| | | #A49 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 240px; |
|---|
| | | } |
|---|
| | | #A49-1 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 223px; |
|---|
| | | } |
|---|
| | | #A50 { |
|---|
| | | width: 25px; |
|---|
| | | height: 25px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 950px; |
|---|
| | | left: 197px; |
|---|
| | | } |
|---|
| | | #A51-1 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 954px; |
|---|
| | | left: 183px; |
|---|
| | | } |
|---|
| | | #A51-2 { |
|---|
| | | width: 69px; |
|---|
| | | height: 34px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 945px; |
|---|
| | | left: 110px; |
|---|
| | | } |
|---|
| | | #A51-3 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 955px; |
|---|
| | | left: 95px; |
|---|
| | | } |
|---|
| | | #A52-1 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 955px; |
|---|
| | | left: 75px; |
|---|
| | | } |
|---|
| | | #A52-2 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 955px; |
|---|
| | | left: 55px; |
|---|
| | | } |
|---|
| | | #A52-3 { |
|---|
| | | width: 23px; |
|---|
| | | height: 125px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 820px; |
|---|
| | | left: 50px; |
|---|
| | | } |
|---|
| | | #A52-4 { |
|---|
| | | width: 17px; |
|---|
| | | height: 30px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 787px; |
|---|
| | | left: 52px; |
|---|
| | | } |
|---|
| | | #A52-5 { |
|---|
| | | width: 17px; |
|---|
| | | height: 75px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 703px; |
|---|
| | | left: 52px; |
|---|
| | | } |
|---|
| | | #A52-6 { |
|---|
| | | width: 17px; |
|---|
| | | height: 75px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 618px; |
|---|
| | | left: 52px; |
|---|
| | | } |
|---|
| | | #A55-1 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 603px; |
|---|
| | | left: 55px; |
|---|
| | | } |
|---|
| | | #A55-2 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 585px; |
|---|
| | | left: 55px; |
|---|
| | | } |
|---|
| | | #A55-3 { |
|---|
| | | width: 17px; |
|---|
| | | height: 30px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 546px; |
|---|
| | | left: 52px; |
|---|
| | | } |
|---|
| | | #A55-4 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 522px; |
|---|
| | | left: 55px; |
|---|
| | | } |
|---|
| | | #A55-5 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 522px; |
|---|
| | | left: 73px; |
|---|
| | | } |
|---|
| | | #A55-6 { |
|---|
| | | width: 70px; |
|---|
| | | height: 40px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 507px; |
|---|
| | | left: 89px; |
|---|
| | | } |
|---|
| | | #A55-7 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 522px; |
|---|
| | | left: 162px; |
|---|
| | | } |
|---|
| | | #A56-1 { |
|---|
| | | width: 148px; |
|---|
| | | height: 26px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 516px; |
|---|
| | | left: 179px; |
|---|
| | | } |
|---|
| | | #A56-2 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 522px; |
|---|
| | | left: 332px; |
|---|
| | | } |
|---|
| | | #A56-3 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 522px; |
|---|
| | | left: 349px; |
|---|
| | | } |
|---|
| | | #A56-4 { |
|---|
| | | width: 22px; |
|---|
| | | height: 22px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 516px; |
|---|
| | | left: 364px; |
|---|
| | | } |
|---|
| | | #A56-5 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 521px; |
|---|
| | | left: 390px; |
|---|
| | | } |
|---|
| | | #A59 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 548px; |
|---|
| | | left: 390px; |
|---|
| | | } |
|---|
| | | #A61 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 572px; |
|---|
| | | left: 390px; |
|---|
| | | } |
|---|
| | | #A63 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 592px; |
|---|
| | | left: 390px; |
|---|
| | | } |
|---|
| | | #A64 { |
|---|
| | | width: 12px; |
|---|
| | | height: 20px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 614px; |
|---|
| | | left: 390px; |
|---|
| | | } |
|---|
| | | #A65 { |
|---|
| | | width: 12px; |
|---|
| | | height: 20px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 614px; |
|---|
| | | left: 405px; |
|---|
| | | } |
|---|
| | | #A66 { |
|---|
| | | width: 684px; |
|---|
| | | height: 50px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 600px; |
|---|
| | | left: 438px; |
|---|
| | | } |
|---|
| | | #A67 { |
|---|
| | | width: 12px; |
|---|
| | | height: 20px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 617px; |
|---|
| | | left: 1140px; |
|---|
| | | } |
|---|
| | | #A68 { |
|---|
| | | width: 12px; |
|---|
| | | height: 20px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 617px; |
|---|
| | | left: 1158px; |
|---|
| | | } |
|---|
| | | #A69 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 581px; |
|---|
| | | left: 1157px; |
|---|
| | | } |
|---|
| | | #A70 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 545px; |
|---|
| | | left: 1157px; |
|---|
| | | } |
|---|
| | | #A71 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 508px; |
|---|
| | | left: 1157px; |
|---|
| | | } |
|---|
| | | #A72 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 466px; |
|---|
| | | left: 1157px; |
|---|
| | | } |
|---|
| | | #A73 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 430px; |
|---|
| | | left: 1157px; |
|---|
| | | } |
|---|
| | | #A74 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 430px; |
|---|
| | | left: 1175px; |
|---|
| | | } |
|---|
| | | #A75 { |
|---|
| | | width: 76px; |
|---|
| | | height: 32px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 416px; |
|---|
| | | left: 1190px; |
|---|
| | | } |
|---|
| | | #A76 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 430px; |
|---|
| | | left: 1268px; |
|---|
| | | } |
|---|
| | | #A78 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 430px; |
|---|
| | | left: 1284px; |
|---|
| | | } |
|---|
| | | #A78-1 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 430px; |
|---|
| | | left: 1299px; |
|---|
| | | } |
|---|
| | | #A79 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 432px; |
|---|
| | | left: 1333px; |
|---|
| | | } |
|---|
| | | #A80 { |
|---|
| | | width: 18px; |
|---|
| | | height: 18px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 429px; |
|---|
| | | left: 1312px; |
|---|
| | | } |
|---|
| | | #A81 { |
|---|
| | | width: 130px; |
|---|
| | | height: 18px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 429px; |
|---|
| | | left: 1349px; |
|---|
| | | } |
|---|
| | | #A82 { |
|---|
| | | width: 82px; |
|---|
| | | height: 18px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 429px; |
|---|
| | | left: 1485px; |
|---|
| | | } |
|---|
| | | #A83-1 { |
|---|
| | | width: 22px; |
|---|
| | | height: 38px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 415px; |
|---|
| | | left: 1575px; |
|---|
| | | } |
|---|
| | | #A83-2 { |
|---|
| | | width: 22px; |
|---|
| | | height: 38px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 415px; |
|---|
| | | left: 1616px; |
|---|
| | | } |
|---|
| | | #A84 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 432px; |
|---|
| | | left: 1655px; |
|---|
| | | } |
|---|
| | | #A85 { |
|---|
| | | width: 145px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 432px; |
|---|
| | | left: 1675px; |
|---|
| | | } |
|---|
| | | #A89 { |
|---|
| | | width: 12px; |
|---|
| | | height: 12px; |
|---|
| | | |
|---|
| | | position: Absolute; |
|---|
| | | top: 432px; |
|---|
| | | left: 1832px; |
|---|
| | | } |
|---|
| | | .divGrenn{ |
|---|
| | | background-color:green; |
|---|
| | | display:block |
|---|
| | | } |
|---|
| | | .divRed{ |
|---|
| | | background-color:red; |
|---|
| | | display:block |
|---|
| | | } |
|---|
| | | .divYellow{ |
|---|
| | | background-color:yellow; |
|---|
| | | display:block |
|---|
| | | } |
|---|
| | | .divnull{ |
|---|
| | | display:none |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | <title>大å±æ¾ç¤º</title> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" style="width: 1920px;height: 1080px;background-color: #7f817cdd;"> |
|---|
| | | <div id="header"> |
|---|
| | | <div id="main1" v-for='items1 in shuzu1'> |
|---|
| | | <div id="main1-1">å½å订åå·ï¼ |
|---|
| | | <div id="main1-1-1" >{{items1['0_order_id']}}</div> |
|---|
| | | </div> |
|---|
| | | <div id="main1-2">å½å产åå·ï¼ |
|---|
| | | <div id="main1-2-1">{{items1['1_recipe_no']}}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="main4"></div> |
|---|
| | | <div id="main2"></div> |
|---|
| | | <div id="main3"> |
|---|
| | | <div id="main3-1"> |
|---|
| | | <div id="main3-1-1">æ»èçµï¼<span>{{shuzu2[0]['0_@jiqidianliang']}}kw</span></div> |
|---|
| | | <div id="main3-1-2"></div> |
|---|
| | | </div> |
|---|
| | | <div id="main3-2"> |
|---|
| | | <div id="main3-2-1">æ»èæ°´ï¼<span>{{shuzu2[0]['1_@jiqidianliang1']}}m³</span></div> |
|---|
| | | <div id="main3-2-2"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="footer"> |
|---|
| | | <img style="width: 100%;height: 100%;" src="../img/大å±.png"> |
|---|
| | | </div> |
|---|
| | | <div id="cangchu" > |
|---|
| | | <img style="width: 100%;height: 100%;" src="../img/cangchu.png"> |
|---|
| | | </div> |
|---|
| | | <div v-for="items in shuzu" :class="items['6_class']" :id="items['3_class_html']" v-if="Object.keys(shuzu[0]).length!=0" class="boli" ></div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <script src="../js/jquery-3.4.1.min.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/bootstrap/3.3.7/js/bootstrap.min.js"></script> |
|---|
| | | <script src="../js/vue.min.js"></script> |
|---|
| | | <script src="../js/axios.min.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <script src="../js/echarts.min.js"></script> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | Vue.prototype.$echarts = echarts; |
|---|
| | | Vue.prototype.$http= axios; |
|---|
| | | let app = new Vue({ |
|---|
| | | el:'#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data:{ |
|---|
| | | shuzu:[{}], |
|---|
| | | shuzu1:[{}], |
|---|
| | | shuzu2:[{}], |
|---|
| | | machineElectric:[{}], |
|---|
| | | machineWater:[{}], |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | val: { |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [{ |
|---|
| | | type: 'category', |
|---|
| | | data: [], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | yAxis: [{ |
|---|
| | | type: "value", |
|---|
| | | name: "è½è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: false, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "rgb(180, 180, 180)", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [{ |
|---|
| | | name: 'çµè', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { |
|---|
| | | color: 'rgb(180, 180, 180)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | val1: { |
|---|
| | | borderColor:'#082352', |
|---|
| | | title: { |
|---|
| | | // text: 'æååºå', |
|---|
| | | // left: '290px', |
|---|
| | | // top: '0px' |
|---|
| | | text:'åæ ¼ç',//主æ é¢ææ¬ |
|---|
| | | left:'center', |
|---|
| | | top:'45%', |
|---|
| | | left:'40%', |
|---|
| | | textStyle:{ |
|---|
| | | color:'#454c5c', |
|---|
| | | align:'center' |
|---|
| | | }, |
|---|
| | | subtextStyle:{ |
|---|
| | | fontFamily : "微软é
é»", |
|---|
| | | color:'#6c7a89', |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | textStyle:{ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | // orient: 'vertical', |
|---|
| | | left: 'left', |
|---|
| | | textStyle:{ |
|---|
| | | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | textStyle:{ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | |
|---|
| | | type: 'pie', |
|---|
| | | radius : ['40%','70%'], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | minAngle:'15', |
|---|
| | | label: { |
|---|
| | | // position: 'inside', |
|---|
| | | show: true, |
|---|
| | | formatter(param) { |
|---|
| | | // correct the percentage |
|---|
| | | return param.name + ' (' + param.percent + '%)'; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { value: 300, name: 'æå',itemStyle:{color:'#53a2ff'} }, |
|---|
| | | { value: 700, name: '次å',itemStyle:{color:'darkseagreen'} } |
|---|
| | | ], |
|---|
| | | // emphasis: { |
|---|
| | | // itemStyle: { |
|---|
| | | // shadowBlur: 10, |
|---|
| | | // shadowOffsetX: 0, |
|---|
| | | // shadowColor: 'rgba(0, 0, 0, 0.5)' |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | itemStyle: { |
|---|
| | | normal:{ |
|---|
| | | label:{ |
|---|
| | | show:true, |
|---|
| | | //formatter: "{b} :\n {c} \n ({d}%)", |
|---|
| | | formatter: "{b} :\n ({d}%)", |
|---|
| | | position:"inner" |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | echarsInit() { |
|---|
| | | |
|---|
| | | let HisArr=""; |
|---|
| | | let dianhao=[]; |
|---|
| | | let shijian=[]; |
|---|
| | | |
|---|
| | | |
|---|
| | | HisArr = this.$echarts.init(document.getElementById('main3-1-2')); |
|---|
| | | |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw.h)' |
|---|
| | | for(let i in this.machineElectric){ |
|---|
| | | dianhao.push(this.machineElectric[i]["0_jiqidianliang"]); |
|---|
| | | shijian.push(this.machineElectric[i]["1_date"]); |
|---|
| | | } |
|---|
| | | console.log(dianhao); |
|---|
| | | this.val.title.text="æ»èçµ(kw.h)" |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | this.val.xAxis[0].data=shijian; |
|---|
| | | this.val.series[0].data=dianhao; |
|---|
| | | HisArr.setOption(this.val); |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | echarsInit1(){ |
|---|
| | | let HisArr=""; |
|---|
| | | let dianhao=[]; |
|---|
| | | let shijian=[]; |
|---|
| | | HisArr = this.$echarts.init(document.getElementById('main3-2-2')); |
|---|
| | | this.val.yAxis[0].name="æ°´è"; |
|---|
| | | this.val.series[0].name='æ°´è(m³)' |
|---|
| | | for(let i in this.machineWater){ |
|---|
| | | dianhao.push(this.machineWater[i]["0_jiqidianliang"]); |
|---|
| | | shijian.push(this.machineWater[i]["1_date"]); |
|---|
| | | } |
|---|
| | | this.val.title.text="æ»èæ°´(m³)" |
|---|
| | | this.val.series[0].itemStyle.color='#00ff00' |
|---|
| | | this.val.xAxis[0].data=shijian; |
|---|
| | | this.val.series[0].data=dianhao; |
|---|
| | | HisArr.setOption(this.val); |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | dingdanxiangqing(){ |
|---|
| | | let HisArr=""; |
|---|
| | | HisArr = this.$echarts.init(document.getElementById('main2')); |
|---|
| | | let a = { |
|---|
| | | value: this.shuzu1[0]['2_smallglass_completed'], |
|---|
| | | |
|---|
| | | name: "æå", |
|---|
| | | itemStyle: { color: '#53a2ff' } |
|---|
| | | |
|---|
| | | } |
|---|
| | | let b = { |
|---|
| | | value: this.shuzu1[0]['4_smallglass_worn'], |
|---|
| | | name: "次å", |
|---|
| | | itemStyle: { color: 'darkseagreen' } |
|---|
| | | |
|---|
| | | } |
|---|
| | | this.val1.title.text="åæ ¼ç" |
|---|
| | | this.val1.title.top="45%" |
|---|
| | | this.val1.title.left="40%" |
|---|
| | | this.val1.series[0].data[0]=a |
|---|
| | | this.val1.series[0].data[1]=b |
|---|
| | | |
|---|
| | | HisArr.setOption(this.val1); |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | dingdanxiangqing1(){ |
|---|
| | | let HisArr=""; |
|---|
| | | HisArr = this.$echarts.init(document.getElementById('main4')); |
|---|
| | | let a = { |
|---|
| | | value: this.shuzu1[0]['2_smallglass_completed'], |
|---|
| | | |
|---|
| | | name: "å·²å®æ", |
|---|
| | | itemStyle: { color: '#53a2ff' } |
|---|
| | | |
|---|
| | | } |
|---|
| | | let b = { |
|---|
| | | value: this.shuzu1[0]['3_smallglass_processing'], |
|---|
| | | name: "æªå®æ", |
|---|
| | | itemStyle: { color: 'darkseagreen' } |
|---|
| | | |
|---|
| | | } |
|---|
| | | this.val1.title.text="订åå å·¥" |
|---|
| | | this.val1.title.top="45%" |
|---|
| | | this.val1.title.left="40%" |
|---|
| | | this.val1.series[0].data[0]=a |
|---|
| | | this.val1.series[0].data[1]=b |
|---|
| | | |
|---|
| | | HisArr.setOption(this.val1); |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | shuzu(){ |
|---|
| | | for(item of this.shuzu){ |
|---|
| | | |
|---|
| | | if((item["3_class_html"].indexOf("33")>-1) || (item["3_class_html"].indexOf("35")>-1) || (item["3_class_html"].indexOf("40")>-1)){ |
|---|
| | | if(item["1_connect_state"]=="å·²è¿æ¥"){ |
|---|
| | | if(item["5_baojin"]>0){ |
|---|
| | | //æ°´å |
|---|
| | | if(item["3_class_html"].indexOf("35")>-1){ |
|---|
| | | if(item["5_baojin"]>1){ |
|---|
| | | item["6_class"]='divYellow'; |
|---|
| | | }else{ |
|---|
| | | item["4_shuliang"]==4?item["6_class"]='divGrenn':item["6_class"]='divnull'; |
|---|
| | | } |
|---|
| | | |
|---|
| | | }else{ |
|---|
| | | item["6_class"]='divYellow'; |
|---|
| | | } |
|---|
| | | |
|---|
| | | }else{ |
|---|
| | | |
|---|
| | | //é»å å å·¥ä¸å¿ |
|---|
| | | item["4_shuliang"]==2?item["6_class"]='divGrenn':item["6_class"]='divnull'; |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | }else{ |
|---|
| | | item["6_class"]='divRed'; |
|---|
| | | } |
|---|
| | | }else{ |
|---|
| | | if(item["1_connect_state"]=="å·²è¿æ¥"){ |
|---|
| | | if(item["5_baojin"]>0){ |
|---|
| | | item["6_class"]='divYellow'; |
|---|
| | | }else{ |
|---|
| | | item["4_shuliang"]>0?item["6_class"]='divGrenn':item["6_class"]='divnull'; |
|---|
| | | } |
|---|
| | | }else{ |
|---|
| | | item["6_class"]='divRed'; |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | machineElectric(){ |
|---|
| | | this.echarsInit() |
|---|
| | | }, |
|---|
| | | machineWater(){ |
|---|
| | | this.echarsInit1() |
|---|
| | | }, |
|---|
| | | shuzu1(){ |
|---|
| | | this.dingdanxiangqing(), |
|---|
| | | this.dingdanxiangqing1() |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | async mounted(){ |
|---|
| | | // let canshu={ |
|---|
| | | // sql:"{call AXJ_dapingxianshijiqishuju()}", |
|---|
| | | // flag:2, |
|---|
| | | // vals:"shuzu" |
|---|
| | | // } |
|---|
| | | // let canshu1={ |
|---|
| | | // sql:"{call AXJ_dapingxianshi_dingdanshuju()}", |
|---|
| | | // flag:2, |
|---|
| | | // vals:"shuzu1" |
|---|
| | | // } |
|---|
| | | // this.shuzu1=await this.returnloadAjxss(canshu1); |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | sql="{call AXJ_dapingxianshijiqishuju()}" |
|---|
| | | this.loadAjxss('大å±æ¾ç¤º',sql,flag,"shuzu") |
|---|
| | | sql="{call AXJ_dapingxianshi_dingdanshuju()}" |
|---|
| | | this.loadAjxss('大å±æ»è®¢åæ°æ®',sql,flag,"shuzu1") |
|---|
| | | sql="{call AXJ_a_largeScreen_sumelectric_select()}" |
|---|
| | | this.loadAjxss('大å±æ»çµèæ°æ®',sql,flag,"machineElectric") |
|---|
| | | sql="{call AXJ_a_largeScreen_sumselect()}" |
|---|
| | | this.loadAjxss('大å±æ»è½èæ»æ°æ®',sql,flag,"shuzu2") |
|---|
| | | sql="{call AXJ_a_largeScreen_sumwater_select()}" |
|---|
| | | this.loadAjxss('大å±æ»æ°´èæ°æ®',sql,flag,"machineWater") |
|---|
| | | |
|---|
| | | |
|---|
| | | await setInterval(()=>{ |
|---|
| | | |
|---|
| | | sql="{call AXJ_dapingxianshijiqishuju()}" |
|---|
| | | this.interValLoadAjxs('大å±æ¾ç¤º',sql,flag,"shuzu") |
|---|
| | | },5000) |
|---|
| | | await setInterval(()=>{ |
|---|
| | | |
|---|
| | | sql="{call AXJ_dapingxianshi_dingdanshuju()}" |
|---|
| | | this.interValLoadAjxs('大å±æ»è®¢åæ°æ®',sql,flag,"shuzu1") |
|---|
| | | },5000) |
|---|
| | | await setInterval(()=>{ |
|---|
| | | sql="{call AXJ_a_largeScreen_sumelectric_select()}" |
|---|
| | | this.interValLoadAjxs('大å±æ»çµèæ°æ®',sql,flag,"machineElectric") |
|---|
| | | },5000) |
|---|
| | | await setInterval(()=>{ |
|---|
| | | sql="{call AXJ_a_largeScreen_sumselect()}" |
|---|
| | | this.interValLoadAjxs('大å±æ»è½èæ»æ°æ®',sql,flag,"shuzu2") |
|---|
| | | },5000) |
|---|
| | | await setInterval(()=>{ |
|---|
| | | sql="{call AXJ_a_largeScreen_sumwater_select()}" |
|---|
| | | this.interValLoadAjxs('大å±æ»æ°´èæ°æ®',sql,flag,"machineWater") |
|---|
| | | },5000) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | var datashijian=[]; |
|---|
| | | function shijian() { |
|---|
| | | datashijian=[]; |
|---|
| | | var s=14; |
|---|
| | | while(s>0){ |
|---|
| | | s=s-1; |
|---|
| | | |
|---|
| | | var date_day7=new Date(Date.parse(new Date())-s*24*60*60*1000); |
|---|
| | | |
|---|
| | | var day7= (date_day7.getMonth()+1) +"/"+date_day7.getDate(); |
|---|
| | | datashijian.push(day7); |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // function drawLine2(){ |
|---|
| | | |
|---|
| | | // var chartDom = document.getElementById('main2'); |
|---|
| | | // var myChart = echarts.init(chartDom); |
|---|
| | | // var option; |
|---|
| | | // alert(app.$data.shuzu1[0]['2_smallglass_completed']); |
|---|
| | | // option = { |
|---|
| | | |
|---|
| | | |
|---|
| | | // borderColor:'#082352', |
|---|
| | | // title: { |
|---|
| | | // // text: 'æååºå', |
|---|
| | | // // left: '290px', |
|---|
| | | // // top: '0px' |
|---|
| | | // text:'åæ ¼ç',//主æ é¢ææ¬ |
|---|
| | | // left:'center', |
|---|
| | | // top:'45%', |
|---|
| | | // left:'40%', |
|---|
| | | // textStyle:{ |
|---|
| | | // color:'#454c5c', |
|---|
| | | // align:'center' |
|---|
| | | // }, |
|---|
| | | // subtextStyle:{ |
|---|
| | | // fontFamily : "微软é
é»", |
|---|
| | | // color:'#6c7a89', |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // }, |
|---|
| | | |
|---|
| | | // tooltip: { |
|---|
| | | // trigger: 'item', |
|---|
| | | // textStyle:{ |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // legend: { |
|---|
| | | // // orient: 'vertical', |
|---|
| | | // left: 'left', |
|---|
| | | // textStyle:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // textStyle:{ |
|---|
| | | |
|---|
| | | // }, |
|---|
| | | // series: [ |
|---|
| | | // { |
|---|
| | | |
|---|
| | | // type: 'pie', |
|---|
| | | // radius : ['40%','70%'], |
|---|
| | | // center: ['50%', '50%'], |
|---|
| | | // minAngle:'15', |
|---|
| | | // label: { |
|---|
| | | // // position: 'inside', |
|---|
| | | // show: true, |
|---|
| | | // formatter(param) { |
|---|
| | | // // correct the percentage |
|---|
| | | // return param.name + ' (' + param.percent + '%)'; |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // data: [ |
|---|
| | | // { value: app.$data.shuzu1[0]['2_smallglass_completed'], name: 'æå',itemStyle:{color:'#53a2ff'} }, |
|---|
| | | // { value: app.$data.shuzu1[0]['3_smallglass_processing'], name: '次å',itemStyle:{color:'darkseagreen'} } |
|---|
| | | // ], |
|---|
| | | // // emphasis: { |
|---|
| | | // // itemStyle: { |
|---|
| | | // // shadowBlur: 10, |
|---|
| | | // // shadowOffsetX: 0, |
|---|
| | | // // shadowColor: 'rgba(0, 0, 0, 0.5)' |
|---|
| | | // // } |
|---|
| | | // // } |
|---|
| | | // itemStyle: { |
|---|
| | | // normal:{ |
|---|
| | | // label:{ |
|---|
| | | // show:true, |
|---|
| | | // //formatter: "{b} :\n {c} \n ({d}%)", |
|---|
| | | // formatter: "{b} :\n ({d}%)", |
|---|
| | | // position:"inner" |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // ] |
|---|
| | | // }; |
|---|
| | | |
|---|
| | | // option && myChart.setOption(option); |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | // var chartDom4 = document.getElementById('main4'); |
|---|
| | | // var myChart4 = echarts.init(chartDom4); |
|---|
| | | // var option4; |
|---|
| | | // option4 = { |
|---|
| | | |
|---|
| | | |
|---|
| | | // borderColor:'#082352', |
|---|
| | | // title: { |
|---|
| | | // // text: 'æååºå', |
|---|
| | | // // left: '290px', |
|---|
| | | // // top: '0px' |
|---|
| | | // text:'订åå å·¥',//主æ é¢ææ¬ |
|---|
| | | // left:'center', |
|---|
| | | // top:'45%', |
|---|
| | | // left:'40%', |
|---|
| | | // textStyle:{ |
|---|
| | | // color:'#454c5c', |
|---|
| | | // align:'center' |
|---|
| | | // }, |
|---|
| | | // subtextStyle:{ |
|---|
| | | // fontFamily : "微软é
é»", |
|---|
| | | // color:'#6c7a89', |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // }, |
|---|
| | | |
|---|
| | | // tooltip: { |
|---|
| | | // trigger: 'item', |
|---|
| | | // textStyle:{ |
|---|
| | | // fontsize: 12, |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // legend: { |
|---|
| | | // // orient: 'vertical', |
|---|
| | | // left: 'left', |
|---|
| | | // textStyle:{ |
|---|
| | | // fontsize: 12, |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // textStyle:{ |
|---|
| | | // fontsize: 12, |
|---|
| | | // }, |
|---|
| | | // series: [ |
|---|
| | | // { |
|---|
| | | |
|---|
| | | // type: 'pie', |
|---|
| | | // radius : ['40%','70%'], |
|---|
| | | // center: ['50%', '50%'], |
|---|
| | | // minAngle:'15', |
|---|
| | | // label: { |
|---|
| | | // // position: 'inside', |
|---|
| | | // show: true, |
|---|
| | | // formatter(param) { |
|---|
| | | // // correct the percentage |
|---|
| | | // return param.name + ' (' + param.percent + '%)'; |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // data: [ |
|---|
| | | // { value: 700, name: 'å·²å®æ',itemStyle:{color:'#53a2ff'} }, |
|---|
| | | // { value: 300, name: 'æªå®æ',itemStyle:{color:'darkseagreen'} } |
|---|
| | | // ], |
|---|
| | | // // emphasis: { |
|---|
| | | // // itemStyle: { |
|---|
| | | // // shadowBlur: 10, |
|---|
| | | // // shadowOffsetX: 0, |
|---|
| | | // // shadowColor: 'rgba(0, 0, 0, 0.5)' |
|---|
| | | // // } |
|---|
| | | // // } |
|---|
| | | // itemStyle: { |
|---|
| | | // normal:{ |
|---|
| | | // label:{ |
|---|
| | | // show:true, |
|---|
| | | // //formatter: "{b} :\n {c} \n ({d}%)", |
|---|
| | | // formatter: "{b} :\n ({d}%)", |
|---|
| | | // position:"inner" |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // ] |
|---|
| | | // }; |
|---|
| | | |
|---|
| | | // option4 && myChart4.setOption(option4); |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | // var chartDom1 = document.getElementById('main3-1-2'); |
|---|
| | | // var myChart1 = echarts.init(chartDom1); |
|---|
| | | // var option1; |
|---|
| | | |
|---|
| | | // option1 = { |
|---|
| | | // title: { |
|---|
| | | // text: 'èçµç»è®¡å¾', |
|---|
| | | // right: '0px', |
|---|
| | | // textStyle:{ |
|---|
| | | |
|---|
| | | |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // }, |
|---|
| | | // tooltip: { |
|---|
| | | // trigger: 'axis', |
|---|
| | | // axisPointer: { |
|---|
| | | // type: 'shadow' |
|---|
| | | // }, |
|---|
| | | // textStyle:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // grid: { |
|---|
| | | // left: '3%', |
|---|
| | | // right: '4%', |
|---|
| | | // bottom: '3%', |
|---|
| | | // containLabel: true |
|---|
| | | // }, |
|---|
| | | // xAxis: [ |
|---|
| | | // { |
|---|
| | | // type: 'category', |
|---|
| | | // data: datashijian, |
|---|
| | | // axisTick: { |
|---|
| | | // alignWithLabel: true |
|---|
| | | // }, |
|---|
| | | // axisLabel:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // ], |
|---|
| | | // yAxis: [ |
|---|
| | | // { |
|---|
| | | // type: 'value', |
|---|
| | | // axisLabel:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // ], |
|---|
| | | // series: [ |
|---|
| | | // { |
|---|
| | | // name: '产é', |
|---|
| | | // type: 'bar', |
|---|
| | | // barWidth: '40%', |
|---|
| | | // data: [100, 52, 200, 334, 330, 220, 80, 460, 310, 120, 430, 260, 250], |
|---|
| | | // itemStyle:{color:'#53a2ff'} |
|---|
| | | // } |
|---|
| | | // ] |
|---|
| | | // }; |
|---|
| | | |
|---|
| | | // option1 && myChart1.setOption(option1); |
|---|
| | | |
|---|
| | | |
|---|
| | | // var chartDom2 = document.getElementById('main3-2-2'); |
|---|
| | | // var myChart2 = echarts.init(chartDom2); |
|---|
| | | // var option2; |
|---|
| | | |
|---|
| | | // option2 = { |
|---|
| | | // title: { |
|---|
| | | // text: 'èæ°´ç»è®¡å¾', |
|---|
| | | // right: '0px', |
|---|
| | | // textStyle:{ |
|---|
| | | |
|---|
| | | |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // }, |
|---|
| | | // tooltip: { |
|---|
| | | // trigger: 'axis', |
|---|
| | | // axisPointer: { |
|---|
| | | // type: 'shadow' |
|---|
| | | // }, |
|---|
| | | // textStyle:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // }, |
|---|
| | | // grid: { |
|---|
| | | // left: '3%', |
|---|
| | | // right: '4%', |
|---|
| | | // bottom: '3%', |
|---|
| | | // containLabel: true |
|---|
| | | // }, |
|---|
| | | // xAxis: [ |
|---|
| | | // { |
|---|
| | | // type: 'category', |
|---|
| | | // data: datashijian, |
|---|
| | | // axisTick: { |
|---|
| | | // alignWithLabel: true |
|---|
| | | // }, |
|---|
| | | // axisLabel:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // ], |
|---|
| | | // yAxis: [ |
|---|
| | | // { |
|---|
| | | // type: 'value', |
|---|
| | | // axisLabel:{ |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // ], |
|---|
| | | // series: [ |
|---|
| | | // { |
|---|
| | | // name: '产é', |
|---|
| | | // type: 'bar', |
|---|
| | | // barWidth: '40%', |
|---|
| | | // data: [100, 52, 200, 334, 330, 220, 80, 460, 310, 120, 430, 260, 250], |
|---|
| | | // itemStyle:{color:'#53a2ff'} |
|---|
| | | // } |
|---|
| | | // ] |
|---|
| | | // }; |
|---|
| | | |
|---|
| | | // option2 && myChart2.setOption(option2); |
|---|
| | | //} |
|---|
| | | </script> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page contentType="text/html;charset=UTF-8"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
|---|
| | | <title>大å±å¯å±</title> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" > |
|---|
| | | <screen-photo :id="15" :intime="this.global.timer" |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | <script> |
|---|
| | | let app= new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data:{ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | |
|---|
| | | <%@ page language="java" import="java.sql.*" contentType="text/html; charset=UTF-8" |
|---|
| | | pageEncoding="UTF-8"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | |
|---|
| | | <link rel="shortcut icon" href="../img/3.ico" /> |
|---|
| | | <title>æå大å±</title> |
|---|
| | | |
|---|
| | | <!-- Font Awesome --> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/bower_components/font-awesome/css/font-awesome.min.css"> |
|---|
| | | <!-- Ionicons --> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/bower_components/Ionicons/css/ionicons.min.css"> |
|---|
| | | <!-- Theme style --> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/dist/css/AdminLTE.min.css"> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/dist/css/skins/skin-blue.min.css"> |
|---|
| | | <link rel="stylesheet" href="..//static/AdminLTE/bower_components/bootstrap/dist/css/bootstrap.min.css"> |
|---|
| | | <style type="text/css"> |
|---|
| | | @IMPORT url("../static/global/showtask/showtask.css"); |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | var contextPath = "${pageContext.request.contextPath}"; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <link type="text/css" rel="stylesheet" |
|---|
| | | href="../static/css/dataTables.bootstrap.css" /> |
|---|
| | | <link type="text/css" rel="stylesheet" |
|---|
| | | href="../static/css/dataTables.tableTools.css" /> |
|---|
| | | |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <script type="text/javascript" src="../static/js/jquery.dataTables.min.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/dataTables.bootstrap.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/dataTables.tableTools.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/moment.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/sucaijiayuan.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/laydate/laydate.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/util/utilAlert.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/bootstrap/3.3.7/js/bootstrap.min.js"></script> |
|---|
| | | |
|---|
| | | <style> |
|---|
| | | *{ |
|---|
| | | margin:0; |
|---|
| | | padding:0; |
|---|
| | | } |
|---|
| | | #top{ |
|---|
| | | height:30%; |
|---|
| | | display:flex; |
|---|
| | | } |
|---|
| | | #center{ |
|---|
| | | height:40%; |
|---|
| | | display:flex; |
|---|
| | | } |
|---|
| | | #bottom{ |
|---|
| | | height:30%; |
|---|
| | | display:flex; |
|---|
| | | } |
|---|
| | | .top_div{ |
|---|
| | | width:25%; |
|---|
| | | height:100%; |
|---|
| | | } |
|---|
| | | .center_div{ |
|---|
| | | width:25%; |
|---|
| | | height:100%; |
|---|
| | | display:flex; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | } |
|---|
| | | .center_divs{ |
|---|
| | | width:50%; |
|---|
| | | height:100%; |
|---|
| | | } |
|---|
| | | .center_div_details{ |
|---|
| | | height:50%; |
|---|
| | | width:100%; |
|---|
| | | } |
|---|
| | | .bottom_div{ |
|---|
| | | width:25%; |
|---|
| | | height:100%; |
|---|
| | | } |
|---|
| | | img{ |
|---|
| | | max-width: 100%; |
|---|
| | | max-height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id='app' @mousemove="onmouseMove" v-loading="loading" element-loading-background="white" style='background-color:#D5EAFF;width:100%;height: 100%;'> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <parts-change></parts-change> |
|---|
| | | <div id="top"> |
|---|
| | | <div class="top_div"> |
|---|
| | | <!-- <img :src="arr[0]"> --> |
|---|
| | | <h2>æå大å±</h2> |
|---|
| | | </div> |
|---|
| | | <div class="top_div" id="Histogram1"></div> |
|---|
| | | <div class="top_div" id="Histogram2"></div> |
|---|
| | | <div class="top_div"></div> |
|---|
| | | </div> |
|---|
| | | <div id="center"> |
|---|
| | | <div class="center_div"> |
|---|
| | | <div class="center_div_details" id="Histogram5"></div> |
|---|
| | | <div class="center_div_details" id="Histogram6"></div> |
|---|
| | | </div> |
|---|
| | | <div style="width:100%;" class="center_divs"> |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | </div> |
|---|
| | | <div class="center_div"> |
|---|
| | | <div class="center_div_details" id="Histogram7"></div> |
|---|
| | | <div class="center_div_details" id="Histogram8"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="bottom"> |
|---|
| | | <div class="bottom_div"></div> |
|---|
| | | <div class="bottom_div" id="Histogram3"></div> |
|---|
| | | <div class="bottom_div" id="Histogram4"></div> |
|---|
| | | <div class="bottom_div"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="4" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1" |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | </div> |
|---|
| | | <script> |
|---|
| | | Vue.prototype.$echarts = echarts |
|---|
| | | Vue.prototype.$http= axios |
|---|
| | | let app = new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins: [mixin], |
|---|
| | | data: { |
|---|
| | | storage: null, |
|---|
| | | val: { |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [{ |
|---|
| | | type: 'category', |
|---|
| | | data: [], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | yAxis: [{ |
|---|
| | | type: "value", |
|---|
| | | name: "è½è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: false, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "rgb(180, 180, 180)", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [{ |
|---|
| | | name: 'çµè', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { |
|---|
| | | color: 'rgb(180, 180, 180)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | tableHead: [{}], |
|---|
| | | selectdate1: '', |
|---|
| | | selectdate2: '', |
|---|
| | | tableData: [{}], |
|---|
| | | show: true, |
|---|
| | | showGlassType: '', |
|---|
| | | showGlassIndex: 0, |
|---|
| | | machineElectric:[{}], |
|---|
| | | machineWater:[{}], |
|---|
| | | loading:true, |
|---|
| | | arr:[] |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit() { |
|---|
| | | |
|---|
| | | let HisArr=[] |
|---|
| | | |
|---|
| | | for(let i=0;i<4;i++){ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i+1))); |
|---|
| | | } |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw·h)' |
|---|
| | | for(let i in this.machineElectric){ |
|---|
| | | this.val.title.text=this.machineElectric[i]["0_machine_name"]+"(kw·h)" |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | this.val.xAxis[0].data=this.machineElectric[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=this.machineElectric[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | echarsInit1(){ |
|---|
| | | let HisArr=[] |
|---|
| | | |
|---|
| | | for(let i=0;i<4;i++){ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i+5))); |
|---|
| | | } |
|---|
| | | this.val.yAxis[0].name="æ°´è"; |
|---|
| | | this.val.series[0].name='æ°´è(m³)' |
|---|
| | | for(let i in this.machineWater){ |
|---|
| | | this.val.title.text=this.machineWater[i]["0_machine_name"]+"(m³)" |
|---|
| | | this.val.series[0].itemStyle.color='#00ff00' |
|---|
| | | this.val.xAxis[0].data=this.machineWater[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=this.machineWater[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | this.loading=false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | tableData(newVal){ |
|---|
| | | newVal.forEach(element => { |
|---|
| | | this.arr.push(element['11_route']) |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | machineElectric(){ |
|---|
| | | this.echarsInit() |
|---|
| | | }, |
|---|
| | | machineWater(){ |
|---|
| | | this.echarsInit1() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}" |
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºé»åæºå¨è®¢åæ¥è¯¢',sql,flag,"tableHead") |
|---|
| | | |
|---|
| | | await this.getTableData('é»å') |
|---|
| | | await this.getMachineElectric('é»å','3') |
|---|
| | | await this.getMachineWater('é»å','1') |
|---|
| | | this.onmouseMove() |
|---|
| | | |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | </script> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page contentType="text/html;charset=UTF-8"%> |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta charset="utf-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <title>é¢å</title> |
|---|
| | | |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <style> |
|---|
| | | |
|---|
| | | |
|---|
| | | body { |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | } |
|---|
| | | #divhead{ |
|---|
| | | float: left; |
|---|
| | | margin-top: 3%; |
|---|
| | | width: 98%; |
|---|
| | | margin-left: 1%; |
|---|
| | | } |
|---|
| | | #divBody{ |
|---|
| | | margin-top: 4%; |
|---|
| | | float: left; |
|---|
| | | width: 100%; |
|---|
| | | height: 60%; |
|---|
| | | } |
|---|
| | | #orderData{ |
|---|
| | | float: left; |
|---|
| | | height: 98%; |
|---|
| | | width: 55%; |
|---|
| | | background-color: blanchedalmond; |
|---|
| | | } |
|---|
| | | #chart-wrap{ |
|---|
| | | float: left; |
|---|
| | | margin-left: 0; |
|---|
| | | height: 98%; |
|---|
| | | width: 44%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | </style> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white" style="height: 99%;"> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0" > |
|---|
| | | <h3>é¢å</h3> |
|---|
| | | <parts-change></parts-change> |
|---|
| | | <div id="divhead"> |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | </div> |
|---|
| | | <div id="divBody"> |
|---|
| | | <div id="orderData"> |
|---|
| | | <screen-order :tablehead="orderHead" :tabledata="orderData"></screen-order> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div id="chart-wrap"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="11" :intime="this.global.timer" v-show="this.global.pollingIndex==1"></screen-photo> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | let app = new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | tableHead: [{}], |
|---|
| | | tableData: [{}], |
|---|
| | | machineElectric:[{}], |
|---|
| | | machineWater:[{}], |
|---|
| | | orderHead:[{}], |
|---|
| | | orderData:[{}], |
|---|
| | | loading:true, |
|---|
| | | val: { |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [{ |
|---|
| | | type: 'category', |
|---|
| | | data: [], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | yAxis: [{ |
|---|
| | | type: "value", |
|---|
| | | name: "è½è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: false, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "rgb(180, 180, 180)", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [{ |
|---|
| | | name: 'çµè', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { |
|---|
| | | color: 'rgb(180, 180, 180)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit(type) { |
|---|
| | | let HisArr=[] |
|---|
| | | let datas=this.machineElectric |
|---|
| | | HisArr[0] = this.$echarts.init(document.getElementById('chart-wrap')); |
|---|
| | | |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw·h)' |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | danwei="(kw·h)" |
|---|
| | | |
|---|
| | | for(let i in datas){ |
|---|
| | | this.val.title.text='é¢å'+danwei |
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | machineElectric(){ |
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.echarsInit(0) |
|---|
| | | this.loading=false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}" |
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºæºå¨è¡¨å¤´',sql,flag,"tableHead") |
|---|
| | | sql="{call AXJ_a_largeScreen_orderRatio_tableHead_select()}" |
|---|
| | | await this.loadAjxss('è´´èæ£æµä»¥åé¢å大å±æ¯ä¾è¡¨å¤´',sql,flag,"orderHead") |
|---|
| | | await this.getTableData('é¢å') |
|---|
| | | await this.getMachineElectric('é¢å',7) |
|---|
| | | let getOrderData=await setInterval(()=>{ |
|---|
| | | sql="{call AXJ_a_largeScreen_orderRatio_tableData_select()}" |
|---|
| | | this.interValLoadAjxs('è´´èæ£æµä»¥åé¢å大å±æ¯ä¾æ°æ®',sql,flag,"orderData",getOrderData) |
|---|
| | | },5000) |
|---|
| | | this.onmouseMove() |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" import="java.sql.*" contentType="text/html; charset=UTF-8" |
|---|
| | | pageEncoding="UTF-8"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <title>åå²å¤§å±</title> |
|---|
| | | <!-- <link rel="stylesheet" href="../js/static/css/element.css"> |
|---|
| | | <link rel="stylesheet" href="../js/static/css/style.css"> |
|---|
| | | <script src="../js/jquery-3.4.1.min.js"></script> |
|---|
| | | <script src="../js/static/js/vue.js"></script> |
|---|
| | | <script src="../js/axios.min.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <script src="../js/static/js/element.js"></script> |
|---|
| | | <script src="../js/static/js/echarts.min.js"></script> --> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | <style > |
|---|
| | | .page-scroll { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .page-scroll .el-scrollbar__wrap { |
|---|
| | | overflow-x: hidden; |
|---|
| | | } |
|---|
| | | .imgs{ |
|---|
| | | width: auto; |
|---|
| | | height: auto; |
|---|
| | | max-width: 80%; |
|---|
| | | max-height: 80%; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white"> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <parts-change></parts-change> |
|---|
| | | <div id="left" style="width:69%;height: 100%;float: left;margin-right: 1%;"> |
|---|
| | | <div style="width: 100%;height: 15%;margin-top: 1%;"> |
|---|
| | | <h3 style="text-align: left;font-size: larger;margin: 0;">ç»çåå²:</h3> |
|---|
| | | <!-- <h3 style="text-align: left;font-size: small;margin: 0;">å·¥ä½ç¶æ: |
|---|
| | | <el-tag v-if="order['9_work_state']!='æ£å¨å·¥ä½'">空é²</el-tag> |
|---|
| | | <el-tag v-else= type="success">æ£å¨å·¥ä½</el-tag> |
|---|
| | | </h3> --> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div style="width:100%;height: 85%;float: left;position: relative;"> |
|---|
| | | <!-- <el-image |
|---|
| | | |
|---|
| | | src="../static/imgs/test.jpg" |
|---|
| | | ></el-image> --> |
|---|
| | | <img class="imgs" :src="picture" alt=""> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div v-if="Object.keys(order).length!=0" id="main" style="width:30%;height: 100%;float: left;"> |
|---|
| | | <el-descriptions style="height: 50%;width: 98%;margin-top: 5%;" title="ç»çå±æ§ï¼åä½ï¼mmï¼" :column="1" border > |
|---|
| | | <el-descriptions-item colon label="订åç¼å·/åºå·ï¼">{{order['1_order_id']}}</el-descriptions-item> |
|---|
| | | <el-descriptions-item colon label="ç»çå度ï¼" label-class-name="my-label" content-class-name="my-content">{{order['2_thickness']}}</el-descriptions-item> |
|---|
| | | <el-descriptions-item colon label="ç»çè²ç§ï¼">{{order['3_color']}}</el-descriptions-item> |
|---|
| | | <el-descriptions-item colon label="å°ç宽é«ï¼">{{order['4_width']+'*'+order['5_height']}}</el-descriptions-item> |
|---|
| | | <el-descriptions-item colon label="åç宽é«ï¼"> |
|---|
| | | {{order['7_original_width']+'*'+order['8_original_height']}} |
|---|
| | | </el-descriptions-item> |
|---|
| | | |
|---|
| | | <!-- <el-descriptions-item colon label="æç¨è½èï¼"> |
|---|
| | | {{order['13_electric']}} (kw·h) |
|---|
| | | </el-descriptions-item> --> |
|---|
| | | |
|---|
| | | <el-descriptions-item colon label="æ»æ°/å·²å®æ/ç ´æï¼"> |
|---|
| | | {{order['10_smallglass_no']+'/'+order['11_smallglass_completed']+'/'+order['12_smallglass_worn']}} |
|---|
| | | </el-descriptions-item> |
|---|
| | | <el-descriptions-item colon label="èææ´æ¢ï¼"> |
|---|
| | | <el-button type="text" @click="openParts" :style="order['14_parts_count']==1?textColor:null" >æ´æ¢</el-button> |
|---|
| | | </el-descriptions-item> |
|---|
| | | <!-- <el-descriptions-item colon label="æå¨ç ´æï¼"> |
|---|
| | | |
|---|
| | | <el-button type="text">ç ´æ</el-button> |
|---|
| | | </el-descriptions-item> --> |
|---|
| | | </el-descriptions> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="2" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1" |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | |
|---|
| | | let app= new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data:{ |
|---|
| | | glassCutInfo:{}, |
|---|
| | | picture:null, |
|---|
| | | order:{}, |
|---|
| | | loading:true, |
|---|
| | | textColor:{ |
|---|
| | | color:'orange' |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | openParts(){ |
|---|
| | | this.$emit('dialogvisible', |
|---|
| | | { |
|---|
| | | 'show':true, |
|---|
| | | 'machineid':4 |
|---|
| | | } |
|---|
| | | ) |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | computed:{ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | glassCutInfo(){ |
|---|
| | | this.picture=this.glassCutInfo[0]['6_route'] |
|---|
| | | this.order=this.glassCutInfo[0] |
|---|
| | | this.loading=false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let sql="{call AXJ_a_largeScreen_glassCut_select()}" |
|---|
| | | let flag=2 |
|---|
| | | let glassCutInfoTimer=await setInterval(()=>{ |
|---|
| | | this.interValLoadAjxs('大å±æ¾ç¤ºåå²',sql,flag,"glassCutInfo",glassCutInfoTimer) |
|---|
| | | },3000) |
|---|
| | | this.onmouseMove() |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" import="java.sql.*" contentType="text/html; charset=UTF-8" |
|---|
| | | pageEncoding="UTF-8"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <title>ä»å¨å¤§å±</title> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white"> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <div id="divHead" style="width: 100%;height:19.5%;float: left;margin-bottom: 0.5%;position: relative;"> |
|---|
| | | <!-- <el-scrollbar class="page-scroll" style="width: 100%;height: 70%;overflow-y: auto;"> --> |
|---|
| | | <div v-for="(items,index) in storage" style="width:6.9% ;height: 35%;margin-top: 1.5%;margin-left: 1.3%;float: left;"> |
|---|
| | | <div |
|---|
| | | class="shelf" |
|---|
| | | :title="items['2_raw_thickness']+items['3_color']+' '+items['4_raw_width']+'*'+items['5_raw_height'] " |
|---|
| | | style="background-color: #909399;width: 100%;height: 40%;float: left;position: relative;"> |
|---|
| | | |
|---|
| | | <div v-if="index<=23" |
|---|
| | | :style="{ |
|---|
| | | width:(items['7_left_pieces']/items['6_pieces']*100)+'%', |
|---|
| | | position: 'absolute', |
|---|
| | | left: 0, |
|---|
| | | height: 100+'%', |
|---|
| | | float: 'left', |
|---|
| | | 'background-image':`url('../js/static/imgs/101.png')` |
|---|
| | | }" |
|---|
| | | |
|---|
| | | |
|---|
| | | > |
|---|
| | | <span style="position: absolute;left: 0;color:white;font-size:small;height: 100%;width: 100%;">{{items['7_left_pieces']+'/'+items['6_pieces']}}</span> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!-- <div v-if="index==24" |
|---|
| | | style="background-image:url('../static/imgs/103.png');width: 0%;height: 100%;float: left;position: absolute; left: 0;"> |
|---|
| | | <span style="position: absolute;left: 0;color:white;font-size: small;height: 100%;width: 100%;">0/50</span> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | {{items['0_id']}} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- <el-progress |
|---|
| | | width="80" |
|---|
| | | percentage="50" |
|---|
| | | :color="customColors" |
|---|
| | | :format="setItemText" |
|---|
| | | ></el-progress> --> |
|---|
| | | |
|---|
| | | |
|---|
| | | <div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="left" style="width: 19.5%;height:80%;float: left;padding: 0; margin-right: 0.5%;"> |
|---|
| | | <div style="width:100%;height: 20%;"> |
|---|
| | | <transition name="el-fade-in"> |
|---|
| | | <div v-show="show" |
|---|
| | | style="float: left;width: 100%;height: 20%;margin-top: 4%;"> |
|---|
| | | |
|---|
| | | <div |
|---|
| | | style="background-image:url('../js/static/imgs/101.png');height: 20px;width: 20px;padding: 0%;float: left;" |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <p style="float: left;margin: 0;margin-left: 1.3%;">{{showGlassType}}</p> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </transition> |
|---|
| | | <!-- <div style="float: left;width: 100%;height: 46%;margin-top: 4%;"> |
|---|
| | | |
|---|
| | | <el-alert style="width: 80%;margin-left: 10%;background-color: transparent;" |
|---|
| | | title="24å·æ¶å空æ¶ï¼åè£
空é²" |
|---|
| | | type="warning" |
|---|
| | | :closable="false" |
|---|
| | | show-icon> |
|---|
| | | <el-button @click="show1" type="warning" style="float: left;">è°ç¨åè£
ä½</el-button> |
|---|
| | | </el-alert> |
|---|
| | | |
|---|
| | | </div> --> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div id="picture" style="width:100%;height: 70%;"> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="main" style="width: 80%;height:80%;float: right;padding: 0;background-color: white;"> |
|---|
| | | <el-date-picker style="float: left;margin-bottom: 0.3%;" |
|---|
| | | v-model="selectdate" |
|---|
| | | type="daterange" |
|---|
| | | range-separator="è³" |
|---|
| | | start-placeholder="å¼å§æ¥æ" |
|---|
| | | end-placeholder="ç»ææ¥æ" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | |
|---|
| | | <el-button type="primary" icon="el-icon-search" |
|---|
| | | style="float: left;margin-left: 0.2%;margin-bottom: 0.3%;" |
|---|
| | | @click="selectSub(1)" |
|---|
| | | >æç´¢</el-button> |
|---|
| | | |
|---|
| | | <el-table |
|---|
| | | :data="tableData" |
|---|
| | | height="92%" |
|---|
| | | |
|---|
| | | style="width: 100%"> |
|---|
| | | <el-table-column |
|---|
| | | v-for="(item,keys,index) in tableHead[0]" |
|---|
| | | :key="index" |
|---|
| | | :label="item" |
|---|
| | | > |
|---|
| | | <el-table-column |
|---|
| | | :prop="keys" |
|---|
| | | > |
|---|
| | | <template slot="header" slot-scope="scope" > |
|---|
| | | <el-input v-model="selectstorage[index]" @keyup.enter.native="selectSub(1)" type="text" size="mini" /> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table-column> |
|---|
| | | |
|---|
| | | |
|---|
| | | </el-table> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="1" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1" |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | |
|---|
| | | <script > |
|---|
| | | let app =new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data:{ |
|---|
| | | storage:null, |
|---|
| | | glassNumGraph:{ |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item' |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | top: '5%', |
|---|
| | | left: 'center' |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: 'æ°é', |
|---|
| | | type: 'pie', |
|---|
| | | radius: ['40%', '70%'], |
|---|
| | | avoidLabelOverlap: true, |
|---|
| | | itemStyle: { |
|---|
| | | borderRadius: 10, |
|---|
| | | borderColor: '#fff', |
|---|
| | | borderWidth: 2 |
|---|
| | | }, |
|---|
| | | label: { |
|---|
| | | formatter:null, |
|---|
| | | fontSize: 20, |
|---|
| | | fontWeight: 'bold',show: true, |
|---|
| | | position: 'center' |
|---|
| | | }, |
|---|
| | | emphasis: { |
|---|
| | | label: { |
|---|
| | | formatter:null, |
|---|
| | | show: true, |
|---|
| | | fontSize: 20, |
|---|
| | | fontWeight: 'bold' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: true |
|---|
| | | }, |
|---|
| | | data:[ |
|---|
| | | { value: null, name: 'æªä½¿ç¨',itemStyle: {color:'#409EFF'} }, |
|---|
| | | { value: null, name: '计åä¸',itemStyle: {color:'#67C23A'} }, |
|---|
| | | { value: null, name: '已使ç¨',itemStyle: {color:'#C0C4CC'} } |
|---|
| | | ], |
|---|
| | | |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | tableHead:[{}], |
|---|
| | | tableData:null, |
|---|
| | | show:true, |
|---|
| | | showGlassType:'', |
|---|
| | | showGlassIndex:0, |
|---|
| | | storageNum:null, |
|---|
| | | selectstorage:["","","","","","","","","",""],//çéåæ° |
|---|
| | | selectdate:["",""],//æ¥æåæ° |
|---|
| | | loading:true, |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit(){ |
|---|
| | | let a = this.$echarts.init( document.getElementById('picture')) |
|---|
| | | this.glassNumGraph.series[0].data[0]['value']=this.storageNum[0]['2_weishiyong'] |
|---|
| | | this.glassNumGraph.series[0].data[1]['value']=this.storageNum[0]['1_jihuashuliang'] |
|---|
| | | this.glassNumGraph.series[0].data[2]['value']=this.storageNum[0]['0_yishiyong'] |
|---|
| | | |
|---|
| | | this.glassNumGraph.series[0].label.formatter=this.storageNum[0]['2_weishiyong']+'/' |
|---|
| | | +this.storageNum[0]['1_jihuashuliang']+'/' |
|---|
| | | +this.storageNum[0]['0_yishiyong'] |
|---|
| | | console.log(this.glassNumGraph.series[0].data); |
|---|
| | | a.setOption(this.glassNumGraph) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | showGlass(){ |
|---|
| | | this.showGlassIndex=this.showGlassIndex<this.storage.length?this.showGlassIndex+1:1 |
|---|
| | | this.show=false |
|---|
| | | this.showGlassType=this.storage[this.showGlassIndex-1]['0_id']+ |
|---|
| | | 'å·æ¶ï¼'+ |
|---|
| | | this.storage[this.showGlassIndex-1]['2_raw_thickness']+ |
|---|
| | | this.storage[this.showGlassIndex-1]['3_color']+' '+ |
|---|
| | | this.storage[this.showGlassIndex-1]['4_raw_width']+ |
|---|
| | | '*'+ |
|---|
| | | this.storage[this.showGlassIndex-1]['5_raw_height'] |
|---|
| | | this.show=true |
|---|
| | | |
|---|
| | | }, |
|---|
| | | async selectSub(type){//è¾å
¥æ¡çé |
|---|
| | | let arrObj={} |
|---|
| | | for(let i in this.selectstorage){ |
|---|
| | | |
|---|
| | | arrObj[i]=this.selectstorage[i]==''?"n*":this.selectstorage[i] |
|---|
| | | } |
|---|
| | | if(this.selectdate!=null){ |
|---|
| | | arrObj.starttime=this.selectdate[0] |
|---|
| | | arrObj.endtime=this.selectdate[1] |
|---|
| | | }else{ |
|---|
| | | arrObj.starttime='' |
|---|
| | | arrObj.endtime='' |
|---|
| | | } |
|---|
| | | arrObj.types=type |
|---|
| | | let sql="{call AXJ_a_largeScreen_storageLog_select(?,?,?,?,?,?,?,?,?,?,?,?,?,?)}~"+JSON.stringify(arrObj) |
|---|
| | | this.loading=true |
|---|
| | | await this.loadAjxss('订åæ¥è¯¢',sql,2,"tableData") |
|---|
| | | |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | watch:{ |
|---|
| | | storageNum(){ |
|---|
| | | this.loading=false, |
|---|
| | | this.echarsInit() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | async mounted() { |
|---|
| | | |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | sql="{call AXJ_a_largeScreen_storageLog__headselect()}" |
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºä»å¨è¡¨å¤´',sql,flag,"tableHead") |
|---|
| | | |
|---|
| | | let timer1=await setInterval(()=>{ |
|---|
| | | sql="{call AXJ_a_largeScreen_storageRack_select()}" |
|---|
| | | this.interValLoadAjxs('大å±æ¾ç¤ºä»å¨æ¶å',sql,flag,"storage",timer1) |
|---|
| | | },3000) |
|---|
| | | let timer2=await setInterval(() => { |
|---|
| | | sql="{call AXJ_a_largeScreen_storageGlassNum_select()}" |
|---|
| | | this.interValLoadAjxs('大å±æ¾ç¤ºä»å¨å©ä½æ°é',sql,flag,"storageNum",timer2) |
|---|
| | | this.showGlass() |
|---|
| | | }, 3000); |
|---|
| | | await this.selectSub(0) |
|---|
| | | this.onmouseMove() |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | |
|---|
| | | <title>å å·¥ä¸å¿</title> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | </head> |
|---|
| | | <style> |
|---|
| | | * { |
|---|
| | | margin: 0px; |
|---|
| | | padding: 0px; |
|---|
| | | font-size: 14px; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | body, |
|---|
| | | html { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | #wai { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | position: relative; |
|---|
| | | margin: 0px; |
|---|
| | | padding: 0px; |
|---|
| | | justify-content: center; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .wai_zs { |
|---|
| | | width: 50%; |
|---|
| | | height: 49%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | border-right: 1px solid white; |
|---|
| | | border-bottom: 1px solid white; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .wai_ys { |
|---|
| | | width: 49%; |
|---|
| | | height: 49%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | border-bottom: 1px solid white; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .wai_zx { |
|---|
| | | width: 50%; |
|---|
| | | height: 50%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | border-right: 1px solid white; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .wai_yx { |
|---|
| | | width: 49%; |
|---|
| | | height: 50%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | .msgtab { |
|---|
| | | width: 50%; |
|---|
| | | height: 35%; |
|---|
| | | border: 1px solid white; |
|---|
| | | border-collapse: collapse; |
|---|
| | | position: absolute; |
|---|
| | | top: 33%; |
|---|
| | | left: 25%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /* |
|---|
| | | |
|---|
| | | .one1, |
|---|
| | | .one1 input { |
|---|
| | | background-color: #F0FFFF; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .double1, |
|---|
| | | .double1 input { |
|---|
| | | background-color: #e1f0fd; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .msgtab tr th { |
|---|
| | | color: white; |
|---|
| | | white-space: nowrap; |
|---|
| | | text-align: center; |
|---|
| | | height: 20px; |
|---|
| | | line-height: 20px; |
|---|
| | | overflow: hidden; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .msgtab tr td { |
|---|
| | | |
|---|
| | | white-space: nowrap; |
|---|
| | | text-align: center; |
|---|
| | | height: 20px; |
|---|
| | | line-height: 20px; |
|---|
| | | overflow: hidden; |
|---|
| | | } */ |
|---|
| | | |
|---|
| | | #container { |
|---|
| | | width: 50%; |
|---|
| | | position: absolute; |
|---|
| | | top: 17%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | #Histogram1 { |
|---|
| | | width: 50%; |
|---|
| | | height: 60%; |
|---|
| | | position: relative; |
|---|
| | | top: 39%; |
|---|
| | | left: 0% |
|---|
| | | } |
|---|
| | | |
|---|
| | | #Histogram2 { |
|---|
| | | width: 50%; |
|---|
| | | height: 60%; |
|---|
| | | position: relative; |
|---|
| | | top: -60%; |
|---|
| | | left: 50% |
|---|
| | | } |
|---|
| | | |
|---|
| | | #Histogram4{ |
|---|
| | | width: 50%; |
|---|
| | | height: 60%; |
|---|
| | | position: relative; |
|---|
| | | top: -60%; |
|---|
| | | left: 0% |
|---|
| | | } |
|---|
| | | |
|---|
| | | #Histogram3 { |
|---|
| | | width: 50%; |
|---|
| | | height: 60%; |
|---|
| | | position: relative; |
|---|
| | | top: 39%; |
|---|
| | | left: 50% |
|---|
| | | } |
|---|
| | | |
|---|
| | | #Histogram6 { |
|---|
| | | |
|---|
| | | width: 50%; |
|---|
| | | height: 58%; |
|---|
| | | position: relative; |
|---|
| | | top: 42%; |
|---|
| | | left: 50%; |
|---|
| | | top: -19%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #Histogram5 { |
|---|
| | | width: 50%; |
|---|
| | | height: 60%; |
|---|
| | | position: relative; |
|---|
| | | left: 0% |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | #Histogram7 { |
|---|
| | | width: 50%; |
|---|
| | | height: 60%; |
|---|
| | | position: relative; |
|---|
| | | left: 50% |
|---|
| | | } |
|---|
| | | |
|---|
| | | #Histogram8 { |
|---|
| | | width: 50%; |
|---|
| | | height: 58%; |
|---|
| | | position: relative; |
|---|
| | | top: -19%; |
|---|
| | | left: 0%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .centdv_time { |
|---|
| | | color: white; |
|---|
| | | width: 50%; |
|---|
| | | height: 30%; |
|---|
| | | position: relative; |
|---|
| | | top: -71%; |
|---|
| | | left: 0%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .centdv_time input { |
|---|
| | | height: 25px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn { |
|---|
| | | text-align: center; |
|---|
| | | width: 100px; |
|---|
| | | height: 29px; |
|---|
| | | /* outline: none; */ |
|---|
| | | border: none; |
|---|
| | | background-color: #5CADFE; |
|---|
| | | box-shadow: 15 8px 16px 15 rgba(0, 0, 0, 0), 15 6px 5px 15 rgba(0, 0, 0, 0.19); |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white"> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <parts-change></parts-change> |
|---|
| | | <div id="wai"> |
|---|
| | | <div class="wai_zs"> |
|---|
| | | <div id="Histogram1"></div> |
|---|
| | | |
|---|
| | | <div id="Histogram2"></div> |
|---|
| | | </div> |
|---|
| | | <div class="wai_ys"> |
|---|
| | | <div id="Histogram3"></div> |
|---|
| | | |
|---|
| | | <div id="Histogram4"></div> |
|---|
| | | </div> |
|---|
| | | <div class="wai_zx"> |
|---|
| | | <div id="Histogram5"></div> |
|---|
| | | |
|---|
| | | <div id="Histogram6"></div> |
|---|
| | | </div> |
|---|
| | | <div class="wai_yx"> |
|---|
| | | <div id="Histogram7"></div> |
|---|
| | | |
|---|
| | | <div id="Histogram8"></div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!-- <div class="centdv_time"> |
|---|
| | | <el-date-picker style="float: center;margin-bottom: 0.3%;" |
|---|
| | | v-model="selectDate" |
|---|
| | | type="daterange" |
|---|
| | | range-separator="è³" |
|---|
| | | start-placeholder="å¼å§æ¥æ" |
|---|
| | | end-placeholder="ç»ææ¥æ"> |
|---|
| | | </el-date-picker> |
|---|
| | | |
|---|
| | | <el-button type="primary" icon="el-icon-search" |
|---|
| | | style="float: center;margin-left: 0.2%;margin-bottom: 0.3%;" |
|---|
| | | >æç´¢</el-button> |
|---|
| | | </div> --> |
|---|
| | | <div class="msgtab"> |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="6" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1" |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | let app = new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins: [mixin], |
|---|
| | | data: { |
|---|
| | | storage: null, |
|---|
| | | val: { |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [ |
|---|
| | | { |
|---|
| | | type: 'category', |
|---|
| | | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], |
|---|
| | | axisLine: { lineStyle: { color: '#5CADFE' } }, |
|---|
| | | axisLabel: { color: '#5CADFE' }, |
|---|
| | | splitLine: { lineStyle: { color: '#5CADFE', type: 'dashed' } } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | type: "value", |
|---|
| | | name: "æ°´è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "#5CADFE", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: true, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "#5CADFE", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "#5CADFE", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: 'æ°´è', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [10, 52, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { color: '#5CADFE' } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | tableHead: [{}], |
|---|
| | | selectDate: '', |
|---|
| | | tableData: [{}], |
|---|
| | | show: true, |
|---|
| | | showGlassType: '', |
|---|
| | | showGlassIndex: 0, |
|---|
| | | machineElectric:[{}], |
|---|
| | | machineWater:[{}], |
|---|
| | | loading:true |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit(type) { |
|---|
| | | |
|---|
| | | let HisArr=[] |
|---|
| | | let datas=type==0?this.machineElectric:this.machineWater |
|---|
| | | for(let i=0;i<datas.length;i++){ |
|---|
| | | if(type==0){ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i*2+2))); |
|---|
| | | }else{ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i*2+1))); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | if(type==0){ |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw·h)' |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | }else{ |
|---|
| | | this.val.yAxis[0].name="æ°´è"; |
|---|
| | | this.val.series[0].name='æ°´è(m³)' |
|---|
| | | this.val.series[0].itemStyle.color='#00ff00' |
|---|
| | | } |
|---|
| | | let danwei=type==0?"(kw·h)":'(m³)' |
|---|
| | | |
|---|
| | | for(let i in datas){ |
|---|
| | | this.val.title.text=datas[i]["0_machine_name"]+danwei |
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | machineElectric(){ |
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.echarsInit(0) |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | machineWater(){ |
|---|
| | | if(Object.keys(this.machineWater[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.echarsInit(1) |
|---|
| | | this.loading=false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}" |
|---|
| | | await this.loadAjxss('大å±å å·¥ä¸å¿è®¢åæ¥è¯¢',sql,flag,"tableHead") |
|---|
| | | await this.getTableData('å å·¥ä¸å¿') // 磨边åè§ |
|---|
| | | await this.getMachineElectric('å å·¥ä¸å¿','4') |
|---|
| | | await this.getMachineWater('å å·¥ä¸å¿','1') |
|---|
| | | this.onmouseMove() |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" import="java.sql.*" contentType="text/html; charset=UTF-8" |
|---|
| | | pageEncoding="UTF-8"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <link rel="shortcut icon" href="../img/3.ico" /> |
|---|
| | | <title>磨边åè§</title> |
|---|
| | | <!-- Font Awesome --> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/bower_components/font-awesome/css/font-awesome.min.css"> |
|---|
| | | <!-- Ionicons --> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/bower_components/Ionicons/css/ionicons.min.css"> |
|---|
| | | <!-- Theme style --> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/dist/css/AdminLTE.min.css"> |
|---|
| | | <link rel="stylesheet" href="../static/AdminLTE/dist/css/skins/skin-blue.min.css"> |
|---|
| | | <link rel="stylesheet" href="..//static/AdminLTE/bower_components/bootstrap/dist/css/bootstrap.min.css"> |
|---|
| | | <style type="text/css"> |
|---|
| | | @IMPORT url("../static/global/showtask/showtask.css"); |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | var contextPath = "${pageContext.request.contextPath}"; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <link type="text/css" rel="stylesheet" |
|---|
| | | href="../static/css/dataTables.bootstrap.css" /> |
|---|
| | | <link type="text/css" rel="stylesheet" |
|---|
| | | href="../static/css/dataTables.tableTools.css" /> |
|---|
| | | |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <script type="text/javascript" src="../static/js/jquery.dataTables.min.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/dataTables.bootstrap.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/dataTables.tableTools.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/moment.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/sucaijiayuan.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/laydate/laydate.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/util/utilAlert.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/bootstrap/3.3.7/js/bootstrap.min.js"></script> |
|---|
| | | |
|---|
| | | <style> |
|---|
| | | *{ |
|---|
| | | margin:0; |
|---|
| | | padding:0; |
|---|
| | | } |
|---|
| | | #top{ |
|---|
| | | height:37%; |
|---|
| | | display:flex; |
|---|
| | | } |
|---|
| | | #center{ |
|---|
| | | height:26%; |
|---|
| | | display:flex; |
|---|
| | | } |
|---|
| | | #bottom{ |
|---|
| | | height:37%; |
|---|
| | | display:flex; |
|---|
| | | } |
|---|
| | | .top_div{ |
|---|
| | | width:33%; |
|---|
| | | height:100%; |
|---|
| | | } |
|---|
| | | .center_divs{ |
|---|
| | | width:100%; |
|---|
| | | height:100%; |
|---|
| | | } |
|---|
| | | .center_div_details{ |
|---|
| | | height:50%; |
|---|
| | | width:100%; |
|---|
| | | } |
|---|
| | | .bottom_div{ |
|---|
| | | width:33%; |
|---|
| | | height:100%; |
|---|
| | | } |
|---|
| | | img{ |
|---|
| | | max-width: 100%; |
|---|
| | | max-height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | } |
|---|
| | | .photo{ |
|---|
| | | max-width: 80%; |
|---|
| | | max-height: 80%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .imga{ |
|---|
| | | position: relative; |
|---|
| | | } |
|---|
| | | #mains{ |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id='app' @mousemove="onmouseMove" v-loading="loading" element-loading-background="white" style='background-color:#D5EAFF;width:100%;height: 100%;'> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <parts-change></parts-change> |
|---|
| | | <div id="top"> |
|---|
| | | <div class="top_div imga"><img class="photo" :src="arr[0]"></div> |
|---|
| | | <div class="top_div" id="Histogram1">æåæº1æ°´è</div> |
|---|
| | | <div class="top_div" id="Histogram2">æåæº1çµè</div> |
|---|
| | | </div> |
|---|
| | | <div id="center"> |
|---|
| | | <div style="width:100%;" class="center_divs"> |
|---|
| | | |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div id="bottom"> |
|---|
| | | <div class="bottom_div imga"><img class="photo" :src="arr[0]"></div> |
|---|
| | | <div class="bottom_div" id="Histogram3">æåæº2æ°´è</div> |
|---|
| | | <div class="bottom_div" id="Histogram4">æåæº2çµè</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="3" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1" |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | </div> |
|---|
| | | <script> |
|---|
| | | Vue.prototype.$echarts = echarts |
|---|
| | | Vue.prototype.$http= axios |
|---|
| | | let app = new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins: [mixin], |
|---|
| | | data: { |
|---|
| | | |
|---|
| | | storage: null, |
|---|
| | | val: { |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [{ |
|---|
| | | type: 'category', |
|---|
| | | data: ['7/1', '7/2', '7/3', '7/4', '7/5', '7/6', '7/7'], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | yAxis: [{ |
|---|
| | | type: "value", |
|---|
| | | name: "è½è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: false, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "rgb(180, 180, 180)", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [{ |
|---|
| | | name: 'çµè', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { |
|---|
| | | color: 'white' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | tableHead: [{}], |
|---|
| | | selectdate1: '', |
|---|
| | | selectdate2: '', |
|---|
| | | tableData: [{}], |
|---|
| | | show: true, |
|---|
| | | showGlassType: '', |
|---|
| | | showGlassIndex: 0, |
|---|
| | | machineElectric:[{}], |
|---|
| | | machineWater:[{}], |
|---|
| | | loading:true, |
|---|
| | | arr:[] |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit(type) { |
|---|
| | | |
|---|
| | | let HisArr=[] |
|---|
| | | let datas=type==0?this.machineElectric:this.machineWater |
|---|
| | | for(let i=0;i<2;i++){ |
|---|
| | | if(type==0){ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i*2+2))); |
|---|
| | | }else{ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i*2+1))); |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | if(type==0){ |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw·h)' |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | }else{ |
|---|
| | | this.val.yAxis[0].name="æ°´è"; |
|---|
| | | this.val.series[0].name='æ°´è(m³)' |
|---|
| | | this.val.series[0].itemStyle.color='#00ff00' |
|---|
| | | } |
|---|
| | | let danwei=type==0?"(kw·h)":'(m³)' |
|---|
| | | for(let i in datas){ |
|---|
| | | if(i>1){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.val.title.text=datas[i]["0_machine_name"]+danwei |
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | tableData(newVal){ |
|---|
| | | newVal.forEach(element => { |
|---|
| | | this.arr.push(element['11_route']) |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | machineElectric(){ |
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.echarsInit(0) |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | machineWater(){ |
|---|
| | | if(Object.keys(this.machineWater[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.echarsInit(1) |
|---|
| | | this.loading=false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}" |
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºç£¨è¾¹æºå¨è®¢åæ¥è¯¢',sql,flag,"tableHead") |
|---|
| | | await this.getTableData('磨边åè§') // 磨边åè§ |
|---|
| | | await this.getMachineElectric('磨边åè§','2') |
|---|
| | | await this.getMachineWater('磨边åè§','1') |
|---|
| | | this.onmouseMove() |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | </script> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
|---|
| | | <html>
|
|---|
| | |
|
|---|
| | | <head>
|
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <title>æ°´å</title>
|
|---|
| | | <script src="../js/main.js"></script>
|
|---|
| | | </head>
|
|---|
| | | <style>
|
|---|
| | | * {
|
|---|
| | | margin: 0px;
|
|---|
| | | padding: 0px;
|
|---|
| | | font-size: 14px;
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | body,
|
|---|
| | | html {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #wai {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | display: flex;
|
|---|
| | | flex-wrap: wrap;
|
|---|
| | | position: relative;
|
|---|
| | | margin: 0px;
|
|---|
| | | padding: 0px;
|
|---|
| | | justify-content: center;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .wai_zs {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 49%;
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | | border-right: 1px solid white;
|
|---|
| | | border-bottom: 1px solid white;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .wai_ys {
|
|---|
| | | width: 49%;
|
|---|
| | | height: 49%;
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | | border-bottom: 1px solid white;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .wai_zx {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 50%;
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | | border-right: 1px solid white;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .wai_yx {
|
|---|
| | | width: 49%;
|
|---|
| | | height: 50%;
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | .msgtab {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 35%;
|
|---|
| | | border: 1px solid white;
|
|---|
| | | border-collapse: collapse;
|
|---|
| | | position: absolute;
|
|---|
| | | top: 33%;
|
|---|
| | | left: 25%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | /* |
|---|
| | |
|
|---|
| | | .one1,
|
|---|
| | | .one1 input {
|
|---|
| | | background-color: #F0FFFF;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .double1,
|
|---|
| | | .double1 input {
|
|---|
| | | background-color: #e1f0fd;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .msgtab tr th {
|
|---|
| | | color: white;
|
|---|
| | | white-space: nowrap;
|
|---|
| | | text-align: center;
|
|---|
| | | height: 20px;
|
|---|
| | | line-height: 20px;
|
|---|
| | | overflow: hidden;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .msgtab tr td {
|
|---|
| | |
|
|---|
| | | white-space: nowrap;
|
|---|
| | | text-align: center;
|
|---|
| | | height: 20px;
|
|---|
| | | line-height: 20px;
|
|---|
| | | overflow: hidden;
|
|---|
| | | } */
|
|---|
| | |
|
|---|
| | | #container {
|
|---|
| | | width: 50%;
|
|---|
| | | position: absolute;
|
|---|
| | | top: 17%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | #Histogram1 {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 60%;
|
|---|
| | | position: relative;
|
|---|
| | | top: 39%;
|
|---|
| | | left: 0%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #Histogram2 {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 60%;
|
|---|
| | | position: relative;
|
|---|
| | | top: -60%;
|
|---|
| | | left: 50%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #Histogram4{
|
|---|
| | | width: 50%;
|
|---|
| | | height: 60%;
|
|---|
| | | position: relative;
|
|---|
| | | top: -60%;
|
|---|
| | | left: 0%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #Histogram3 {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 60%;
|
|---|
| | | position: relative;
|
|---|
| | | top: 39%;
|
|---|
| | | left: 50%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #Histogram6 {
|
|---|
| | | |
|---|
| | | width: 50%;
|
|---|
| | | height: 58%;
|
|---|
| | | position: relative;
|
|---|
| | | top: 42%;
|
|---|
| | | left: 50%;
|
|---|
| | | top: -19%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #Histogram5 {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 60%;
|
|---|
| | | position: relative;
|
|---|
| | | left: 0%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | #Histogram7 {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 60%;
|
|---|
| | | position: relative;
|
|---|
| | | left: 50%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #Histogram8 {
|
|---|
| | | width: 50%;
|
|---|
| | | height: 58%;
|
|---|
| | | position: relative;
|
|---|
| | | top: -19%;
|
|---|
| | | left: 0%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .centdv_time {
|
|---|
| | | color: white;
|
|---|
| | | width: 50%;
|
|---|
| | | height: 30%;
|
|---|
| | | position: relative;
|
|---|
| | | top: -71%;
|
|---|
| | | left: 0%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .centdv_time input {
|
|---|
| | | height: 25px;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .btn {
|
|---|
| | | text-align: center;
|
|---|
| | | width: 100px;
|
|---|
| | | height: 29px;
|
|---|
| | | /* outline: none; */
|
|---|
| | | border: none;
|
|---|
| | | background-color: #5CADFE;
|
|---|
| | | box-shadow: 15 8px 16px 15 rgba(0, 0, 0, 0), 15 6px 5px 15 rgba(0, 0, 0, 0.19);
|
|---|
| | | }
|
|---|
| | | </style>
|
|---|
| | |
|
|---|
| | | <body>
|
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white">
|
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0">
|
|---|
| | | <parts-change></parts-change>
|
|---|
| | | <div id="wai">
|
|---|
| | | <div class="wai_zs">
|
|---|
| | | <div id="Histogram1"></div>
|
|---|
| | |
|
|---|
| | | <div id="Histogram2"></div>
|
|---|
| | | </div>
|
|---|
| | | <div class="wai_ys">
|
|---|
| | | <div id="Histogram3"></div>
|
|---|
| | |
|
|---|
| | | <div id="Histogram4"></div>
|
|---|
| | | </div>
|
|---|
| | | <div class="wai_zx">
|
|---|
| | | <div id="Histogram5"></div>
|
|---|
| | |
|
|---|
| | | <div id="Histogram6"></div>
|
|---|
| | | </div>
|
|---|
| | | <div class="wai_yx">
|
|---|
| | | <div id="Histogram7"></div>
|
|---|
| | |
|
|---|
| | | <div id="Histogram8"></div>
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <!-- <div class="centdv_time">
|
|---|
| | | <el-date-picker style="float: center;margin-bottom: 0.3%;"
|
|---|
| | | v-model="selectDate"
|
|---|
| | | type="daterange"
|
|---|
| | | range-separator="è³"
|
|---|
| | | start-placeholder="å¼å§æ¥æ"
|
|---|
| | | end-placeholder="ç»ææ¥æ">
|
|---|
| | | </el-date-picker>
|
|---|
| | | |
|---|
| | | <el-button type="primary" icon="el-icon-search"
|
|---|
| | | style="float: center;margin-left: 0.2%;margin-bottom: 0.3%;"
|
|---|
| | | >æç´¢</el-button>
|
|---|
| | | </div> -->
|
|---|
| | | <div class="msgtab">
|
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <screen-photo :id="5" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1"
|
|---|
| | | >
|
|---|
| | | </screen-photo> |
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | </body>
|
|---|
| | |
|
|---|
| | | <script>
|
|---|
| | | let app = new Vue({
|
|---|
| | | el: '#app',
|
|---|
| | | mixins: [mixin],
|
|---|
| | | data: {
|
|---|
| | | storage: null,
|
|---|
| | | val: {
|
|---|
| | | title:{
|
|---|
| | | text:'',
|
|---|
| | | left:'center'
|
|---|
| | | },
|
|---|
| | | tooltip: {
|
|---|
| | | trigger: 'axis',
|
|---|
| | | axisPointer: {
|
|---|
| | | type: 'shadow'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | grid: {
|
|---|
| | | left: '3%',
|
|---|
| | | right: '4%',
|
|---|
| | | bottom: '3%',
|
|---|
| | | containLabel: true
|
|---|
| | | },
|
|---|
| | | xAxis: [
|
|---|
| | | {
|
|---|
| | | type: 'category',
|
|---|
| | | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
|---|
| | | axisLine: { lineStyle: { color: '#5CADFE' } },
|
|---|
| | | axisLabel: { color: '#5CADFE' },
|
|---|
| | | splitLine: { lineStyle: { color: '#5CADFE', type: 'dashed' } }
|
|---|
| | | }
|
|---|
| | | ],
|
|---|
| | | yAxis: [
|
|---|
| | | {
|
|---|
| | | type: "value",
|
|---|
| | | name: "æ°´è",
|
|---|
| | | nameTextStyle: {
|
|---|
| | | color: "#5CADFE",
|
|---|
| | | fontSize: 12,
|
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦
|
|---|
| | | },
|
|---|
| | | splitLine: {
|
|---|
| | | // ç½æ ¼çº¿
|
|---|
| | | show: true,
|
|---|
| | | lineStyle: { //åå²çº¿
|
|---|
| | | color: "#5CADFE",
|
|---|
| | | width: 1,
|
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | axisLabel: {
|
|---|
| | | // è½´æå
|
|---|
| | | color: "#5CADFE",
|
|---|
| | | fontSize: 12,
|
|---|
| | | },
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | ],
|
|---|
| | | series: [
|
|---|
| | | {
|
|---|
| | | name: 'æ°´è',
|
|---|
| | | type: 'bar',
|
|---|
| | | barWidth: '80%',
|
|---|
| | | data: [10, 52, 200, 334, 390, 330, 220],
|
|---|
| | | itemStyle: { color: '#5CADFE' }
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | ]
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | tableHead: [{}],
|
|---|
| | | selectDate: '',
|
|---|
| | | tableData: [{}],
|
|---|
| | | show: true,
|
|---|
| | | showGlassType: '',
|
|---|
| | | showGlassIndex: 0,
|
|---|
| | | machineElectric:[{}],
|
|---|
| | | machineWater:[{}],
|
|---|
| | | loading:true
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | echarsInit(type) {
|
|---|
| | | let HisArr=[]
|
|---|
| | | let datas=type==0?this.machineElectric:this.machineWater
|
|---|
| | | for(let i=0;i<datas.length;i++){
|
|---|
| | | if(type==0){
|
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i*2+2)));
|
|---|
| | | }else{
|
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('Histogram'+(i*2+1)));
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | if(type==0){
|
|---|
| | | this.val.yAxis[0].name="çµè";
|
|---|
| | | this.val.series[0].name='çµè(kw·h)'
|
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)'
|
|---|
| | | }else{
|
|---|
| | | this.val.yAxis[0].name="æ°´è";
|
|---|
| | | this.val.series[0].name='æ°´è(m³)'
|
|---|
| | | this.val.series[0].itemStyle.color='#00ff00'
|
|---|
| | | }
|
|---|
| | | let danwei=type==0?"(kw·h)":'(m³)'
|
|---|
| | | |
|---|
| | | for(let i in datas){
|
|---|
| | | this.val.title.text=datas[i]["0_machine_name"]+danwei
|
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(',');
|
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(',');
|
|---|
| | | HisArr[i].setOption(this.val);
|
|---|
| | | } |
|---|
| | | },
|
|---|
| | | },
|
|---|
| | | computed: {
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | watch:{
|
|---|
| | | machineElectric(){
|
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){
|
|---|
| | | return |
|---|
| | | }
|
|---|
| | | this.echarsInit(0)
|
|---|
| | | this.loading=false
|
|---|
| | | },
|
|---|
| | | machineWater(){
|
|---|
| | | if(Object.keys(this.machineWater[0]).length==0){
|
|---|
| | | return |
|---|
| | | }
|
|---|
| | | this.echarsInit(1)
|
|---|
| | | this.loading=false
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | async mounted() {
|
|---|
| | | let sql=""
|
|---|
| | | let flag=2
|
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}"
|
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºæ°´åæºå¨è®¢åæ¥è¯¢',sql,flag,"tableHead")
|
|---|
| | | await this.getTableData('æ°´å') // 磨边åè§
|
|---|
| | | await this.getMachineElectric('æ°´å','3')
|
|---|
| | | await this.getMachineWater('æ°´å','1')
|
|---|
| | | this.onmouseMove()
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | })
|
|---|
| | |
|
|---|
| | | </script>
|
|---|
| | |
|
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" contentType="text/html; charset=UTF-8" |
|---|
| | | pageEncoding="UTF-8"%> |
|---|
| | | <%@page import="builder.Manager"%> |
|---|
| | | <%@page import="ng.db.*"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | |
|---|
| | | <title>ä¸å°çº¿</title> |
|---|
| | | </head> |
|---|
| | | <style> |
|---|
| | | body { |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | flex-wrap: nowrap; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .page-scroll { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .page-scroll .el-scrollbar__wrap { |
|---|
| | | overflow-x: hidden; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__header { |
|---|
| | | height: 20%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | #app { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #app1 { |
|---|
| | | width: 60%; |
|---|
| | | position: absolute; |
|---|
| | | left: 2%; |
|---|
| | | top: 3%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #youtu { |
|---|
| | | height: 50%; |
|---|
| | | width: 30%; |
|---|
| | | position: absolute; |
|---|
| | | right: 2%; |
|---|
| | | top: 2%; |
|---|
| | | text-align: center; |
|---|
| | | line-height: 275px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #time { |
|---|
| | | height: 50%; |
|---|
| | | width: 30%; |
|---|
| | | position: absolute; |
|---|
| | | top: 50%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #har { |
|---|
| | | width: 99%; |
|---|
| | | position: absolute; |
|---|
| | | height: 2%; |
|---|
| | | top: 53%; |
|---|
| | | background-color: darkgrey; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #app2 { |
|---|
| | | width: 96%; |
|---|
| | | height: 36%; |
|---|
| | | position: absolute; |
|---|
| | | left: 2%; |
|---|
| | | top: 62%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .chart-wrap { |
|---|
| | | width: 50%; |
|---|
| | | height: 100%; |
|---|
| | | float: left; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #time { |
|---|
| | | width: 50%; |
|---|
| | | height: 5%; |
|---|
| | | position: absolute; |
|---|
| | | left: 2%; |
|---|
| | | top: 35%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #time2 { |
|---|
| | | width: 50%; |
|---|
| | | height: 10%; |
|---|
| | | position: absolute; |
|---|
| | | left: 2%; |
|---|
| | | top: 42%; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <div id='app' @mousemove="onmouseMove" v-loading="loading" element-loading-background="white"> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <div id='app1' style="width: 60%;height:33%;float: right;padding: 0;background-color: white;"> |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div id='time'> |
|---|
| | | <div style="margin-top: 5%;height: 3%;"> |
|---|
| | | å½åè¿åº¦ï¼<el-progress :text-inside="true" :stroke-width="26" :percentage="ratio"></el-progress> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div id='youtu'> |
|---|
| | | <img class="imgCenter" alt="" :src="tableData[0]['11_route']"> |
|---|
| | | </div> |
|---|
| | | <div id='har'></div> |
|---|
| | | <div id='app2' > |
|---|
| | | <!-- <show-table :tablehead="tableHead2" :tabledata="tableData2"></show-table> --> |
|---|
| | | <div id="chart-wrap0" class="chart-wrap"></div> |
|---|
| | | <div id="chart-wrap1" class="chart-wrap"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="this.machineScreen" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1" |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </body> |
|---|
| | | <script type="text/javascript"> |
|---|
| | | let app = new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins: [mixin], |
|---|
| | | data: { |
|---|
| | | storage: null, |
|---|
| | | val: { |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [{ |
|---|
| | | type: 'category', |
|---|
| | | data: ['7/1', '7/2', '7/3', '7/4', '7/5', '7/6', '7/7'], |
|---|
| | | axisLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | color: 'rgb(30, 144, 255)' |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | lineStyle: { |
|---|
| | | color: 'rgb(30, 144, 255)', |
|---|
| | | type: 'dashed' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | yAxis: [{ |
|---|
| | | type: "value", |
|---|
| | | name: "è½è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: false, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "rgb(180, 180, 180)", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "rgb(30, 144, 255)", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [{ |
|---|
| | | name: 'è½è', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { |
|---|
| | | color: 'rgb(180, 180, 180)' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | machineLocal:<%= request.getParameter("local")%>, |
|---|
| | | machineScreen:null, |
|---|
| | | |
|---|
| | | tableHead: [{}], |
|---|
| | | selectdate1: '', |
|---|
| | | selectdate2: '', |
|---|
| | | tableData: [{}], |
|---|
| | | show: true, |
|---|
| | | showGlassType: '', |
|---|
| | | showGlassIndex: 0, |
|---|
| | | machineElectric:[{}], |
|---|
| | | machineWater:[{}], |
|---|
| | | loading:true, |
|---|
| | | ratio:0 |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit(type) { |
|---|
| | | let HisArr=[] |
|---|
| | | let datas=type==0?this.machineElectric:this.machineWater |
|---|
| | | for(let i=0;i<datas.length;i++){ |
|---|
| | | if(i>1){ |
|---|
| | | break |
|---|
| | | } |
|---|
| | | if(type==0){ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('chart-wrap'+i)); |
|---|
| | | }else{ |
|---|
| | | HisArr[i] = this.$echarts.init(document.getElementById('chart-wrap')); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if(type==0){ |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw·h)' |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | }else{ |
|---|
| | | this.val.yAxis[0].name="æ°´è"; |
|---|
| | | this.val.series[0].name='æ°´è(m³)' |
|---|
| | | this.val.series[0].itemStyle.color='#00ff00' |
|---|
| | | } |
|---|
| | | let danwei=type==0?"(kw·h)":'(m³)' |
|---|
| | | |
|---|
| | | for(let i in datas){ |
|---|
| | | if(i>1){ |
|---|
| | | break |
|---|
| | | } |
|---|
| | | this.val.title.text=datas[i]["0_machine_name"]+danwei |
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | machineElectric(){ |
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.echarsInit(0) |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | tableHead(newVal,oldVal){ |
|---|
| | | delete newVal[0]['7_parts_change'] |
|---|
| | | delete newVal[0]['0_machine_name'] |
|---|
| | | |
|---|
| | | newVal[0]['8_ratio']='ç´éç' |
|---|
| | | //newVal[0]['9_work_state']='ç¶æ' |
|---|
| | | }, |
|---|
| | | tableData(){ |
|---|
| | | this.ratio=this.tableData[0]['8_ratio']*1 |
|---|
| | | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}" |
|---|
| | | await this.loadAjxss('大å±ä¸å°è¡¨å¤´æ¥è¯¢',sql,flag,"tableHead") |
|---|
| | | await this.getTableData('ä¸å°') // ä¸å° |
|---|
| | | await this.getMachineElectric('ä¸å°','5') |
|---|
| | | this.onmouseMove() |
|---|
| | | |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | switch (this.machineLocal) { |
|---|
| | | case 0: |
|---|
| | | this.machineScreen=8 |
|---|
| | | break; |
|---|
| | | case 1: |
|---|
| | | this.machineScreen=8 |
|---|
| | | break; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page contentType="text/html;charset=UTF-8"%>
|
|---|
| | | <!DOCTYPE html>
|
|---|
| | | <html>
|
|---|
| | | <head>
|
|---|
| | | <meta charset="utf-8">
|
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <title>è´´èå°ç»</title>
|
|---|
| | |
|
|---|
| | | <script src="../js/main.js"></script>
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | <style>
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | body {
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | | }
|
|---|
| | | #divhead{
|
|---|
| | | float: left;
|
|---|
| | | margin-top: 3%;
|
|---|
| | | width: 98%;
|
|---|
| | | margin-left: 1%;
|
|---|
| | | }
|
|---|
| | | #divBody{
|
|---|
| | | margin-top: 4%;
|
|---|
| | | float: left;
|
|---|
| | | width: 100%;
|
|---|
| | | height: 60%;
|
|---|
| | | }
|
|---|
| | | #orderData{
|
|---|
| | | float: left;
|
|---|
| | | height: 98%;
|
|---|
| | | width: 55%;
|
|---|
| | | background-color: blanchedalmond;
|
|---|
| | | }
|
|---|
| | | #chart-wrap{
|
|---|
| | | float: left;
|
|---|
| | | margin-left: 0;
|
|---|
| | | height: 98%;
|
|---|
| | | width: 44%;
|
|---|
| | | |
|---|
| | | }
|
|---|
| | |
|
|---|
| | | </style>
|
|---|
| | | </head>
|
|---|
| | | <body>
|
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white" style="height: 99%;">
|
|---|
| | | <div v-show="this.global.pollingIndex==0" id="mains">
|
|---|
| | | <h3>è´´èå°ç»</h3>
|
|---|
| | | <parts-change></parts-change>
|
|---|
| | | <div id="divhead">
|
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | </div>
|
|---|
| | | <div id="divBody">
|
|---|
| | | <div id="orderData">
|
|---|
| | | <screen-order :tablehead="orderHead" :tabledata="orderData"></screen-order> |
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <div id="chart-wrap"></div>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | <screen-photo :id="13" :intime="this.global.timer" v-show="this.global.pollingIndex==1"></screen-photo> |
|---|
| | |
|
|---|
| | |
|
|---|
| | | </div>
|
|---|
| | | </body>
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | <script>
|
|---|
| | | let app = new Vue({
|
|---|
| | | el: '#app',
|
|---|
| | | mixins:[mixin],
|
|---|
| | | |
|---|
| | | data() {
|
|---|
| | | return {
|
|---|
| | | tableHead: [{}],
|
|---|
| | | tableData: [{}],
|
|---|
| | | machineElectric:[{}],
|
|---|
| | | machineWater:[{}],
|
|---|
| | | orderHead:[{}],
|
|---|
| | | orderData:[{}],
|
|---|
| | | loading:true,
|
|---|
| | | val: {
|
|---|
| | | title:{
|
|---|
| | | text:'',
|
|---|
| | | left:'center'
|
|---|
| | | },
|
|---|
| | | tooltip: {
|
|---|
| | | trigger: 'axis',
|
|---|
| | | axisPointer: {
|
|---|
| | | type: 'shadow'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | grid: {
|
|---|
| | | left: '3%',
|
|---|
| | | right: '4%',
|
|---|
| | | bottom: '3%',
|
|---|
| | | containLabel: true
|
|---|
| | | },
|
|---|
| | | xAxis: [{
|
|---|
| | | type: 'category',
|
|---|
| | | data: [],
|
|---|
| | | axisLine: {
|
|---|
| | | lineStyle: {
|
|---|
| | | color: 'rgb(30, 144, 255)'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | axisLabel: {
|
|---|
| | | color: 'rgb(30, 144, 255)'
|
|---|
| | | },
|
|---|
| | | splitLine: {
|
|---|
| | | lineStyle: {
|
|---|
| | | color: 'rgb(30, 144, 255)',
|
|---|
| | | type: 'dashed'
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }],
|
|---|
| | | yAxis: [{
|
|---|
| | | type: "value",
|
|---|
| | | name: "è½è",
|
|---|
| | | nameTextStyle: {
|
|---|
| | | color: "rgb(30, 144, 255)",
|
|---|
| | | fontSize: 12,
|
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦
|
|---|
| | | },
|
|---|
| | | splitLine: {
|
|---|
| | | // ç½æ ¼çº¿
|
|---|
| | | show: false,
|
|---|
| | | lineStyle: { //åå²çº¿
|
|---|
| | | color: "rgb(180, 180, 180)",
|
|---|
| | | width: 1,
|
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | axisLabel: {
|
|---|
| | | // è½´æå
|
|---|
| | | color: "rgb(30, 144, 255)",
|
|---|
| | | fontSize: 12,
|
|---|
| | | },
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | ],
|
|---|
| | | series: [{
|
|---|
| | | name: 'çµè',
|
|---|
| | | type: 'bar',
|
|---|
| | | barWidth: '80%',
|
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220],
|
|---|
| | | itemStyle: {
|
|---|
| | | color: 'rgb(180, 180, 180)'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | ]
|
|---|
| | | },
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | echarsInit(type) {
|
|---|
| | | let HisArr=[]
|
|---|
| | | let datas=this.machineElectric
|
|---|
| | | HisArr[0] = this.$echarts.init(document.getElementById('chart-wrap'));
|
|---|
| | | |
|---|
| | | this.val.yAxis[0].name="çµè";
|
|---|
| | | this.val.series[0].name='çµè(kw·h)'
|
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)'
|
|---|
| | | danwei="(kw·h)"
|
|---|
| | | |
|---|
| | | for(let i in datas){
|
|---|
| | | this.val.title.text=this.machineElectric[i]["0_machine_name"]+danwei
|
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(',');
|
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(',');
|
|---|
| | | HisArr[i].setOption(this.val);
|
|---|
| | | } |
|---|
| | | },
|
|---|
| | | |
|---|
| | | },
|
|---|
| | | watch: {
|
|---|
| | | machineElectric(){
|
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){
|
|---|
| | | return |
|---|
| | | }
|
|---|
| | | this.echarsInit(0)
|
|---|
| | | this.loading=false
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | async mounted() {
|
|---|
| | | let sql=""
|
|---|
| | | let flag=2
|
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}"
|
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºæºå¨è¡¨å¤´',sql,flag,"tableHead")
|
|---|
| | | sql="{call AXJ_a_largeScreen_orderRatio_tableHead_select()}"
|
|---|
| | | await this.loadAjxss('è´´èæ£æµä»¥åé¢å大å±æ¯ä¾è¡¨å¤´',sql,flag,"orderHead")
|
|---|
| | | await this.getTableData('è´´è') // 磨边åè§
|
|---|
| | | await this.getMachineElectric('è´´è','6')
|
|---|
| | | let timer1=await setInterval(()=>{
|
|---|
| | | sql="{call AXJ_a_largeScreen_orderRatio_tableData_select()}"
|
|---|
| | | this.interValLoadAjxs('è´´è以åé¢å大å±æ¯ä¾æ°æ®',sql,flag,"orderData",timer1)
|
|---|
| | | },5000)
|
|---|
| | | this.onmouseMove()
|
|---|
| | | |
|---|
| | | }
|
|---|
| | | }); |
|---|
| | | </script>
|
|---|
| | |
|
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %> |
|---|
| | | <%@page import="builder.Manager" %> |
|---|
| | | <%@page import="ng.db.*" %> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | |
|---|
| | | <title>ççµæ£æµ</title> |
|---|
| | | </head> |
|---|
| | | <style> |
|---|
| | | *{ |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | body { |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | flex-wrap: nowrap; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .page-scroll { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .page-scroll .el-scrollbar__wrap { |
|---|
| | | overflow-x: hidden; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table__header { |
|---|
| | | height: 20%; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | #app { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #app1 { |
|---|
| | | width: 60%; |
|---|
| | | position: absolute; |
|---|
| | | left: 2%; |
|---|
| | | top: 3%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #chart-wrap { |
|---|
| | | height: 40%; |
|---|
| | | width: 30%; |
|---|
| | | position: absolute; |
|---|
| | | right: 2%; |
|---|
| | | top: 2%; |
|---|
| | | text-align: center; |
|---|
| | | line-height: 275px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #har { |
|---|
| | | width: 99%; |
|---|
| | | position: absolute; |
|---|
| | | height: 2%; |
|---|
| | | top: 43%; |
|---|
| | | background-color: darkgrey; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #picture1 { |
|---|
| | | width: 50%; |
|---|
| | | position: absolute; |
|---|
| | | height:100%; |
|---|
| | | |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #picture2 { |
|---|
| | | width: 50%; |
|---|
| | | height:100%; |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | #pictue{ |
|---|
| | | position: absolute; |
|---|
| | | top: 50%; |
|---|
| | | width: 99%; |
|---|
| | | height:48vh; |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | img{ |
|---|
| | | max-width: 100%; |
|---|
| | | max-height: 100%; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <div id='app' @mousemove="onmouseMove" v-loading="loading" element-loading-background="white"> |
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0"> |
|---|
| | | <parts-change></parts-change> |
|---|
| | | <div id='app1' style="width: 60%;height:30%;float: right;padding: 0;background-color: white;"> |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData1"></show-table> |
|---|
| | | </div> |
|---|
| | | <div id='chart-wrap'> |
|---|
| | | </div> |
|---|
| | | <div id='har'></div> |
|---|
| | | <div id="pictue"> |
|---|
| | | <div id='picture1' > |
|---|
| | | <img class="imgCenter" style="float: right;" :src="pictures[0]" alt=""> |
|---|
| | | </div> |
|---|
| | | <div id="picture2" style="float:right"> |
|---|
| | | <img class="imgCenter" style="float: left;" :src="pictures[1]" alt=""> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <screen-photo :id="this.machineScreen" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1 " |
|---|
| | | > |
|---|
| | | </screen-photo> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </body> |
|---|
| | | <script type="text/javascript"> |
|---|
| | | let app = new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins: [mixin], |
|---|
| | | data: { |
|---|
| | | storage: null, |
|---|
| | | val:{ |
|---|
| | | title:{ |
|---|
| | | text:'', |
|---|
| | | left:'center' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'axis', |
|---|
| | | axisPointer: { |
|---|
| | | type: 'shadow' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '3%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | xAxis: [ |
|---|
| | | { |
|---|
| | | type: 'category', |
|---|
| | | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], |
|---|
| | | axisLine: { lineStyle: { color: '#5CADFE' } }, |
|---|
| | | axisLabel: { color: '#5CADFE' }, |
|---|
| | | splitLine: { lineStyle: { color: '#5CADFE', type: 'dashed' } } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | type: "value", |
|---|
| | | name: "æ°´è", |
|---|
| | | nameTextStyle: { |
|---|
| | | color: "#5CADFE", |
|---|
| | | fontSize: 12, |
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦ |
|---|
| | | }, |
|---|
| | | splitLine: { |
|---|
| | | // ç½æ ¼çº¿ |
|---|
| | | show: true, |
|---|
| | | lineStyle: { //åå²çº¿ |
|---|
| | | color: "#5CADFE", |
|---|
| | | width: 1, |
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿ |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | // è½´æå |
|---|
| | | color: "#5CADFE", |
|---|
| | | fontSize: 12, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: 'æ°´è', |
|---|
| | | type: 'bar', |
|---|
| | | barWidth: '80%', |
|---|
| | | data: [10, 52, 200, 334, 390, 330, 220], |
|---|
| | | itemStyle: { color: '#5CADFE' } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | |
|---|
| | | tableHead: [{}], |
|---|
| | | selectdate1: '', |
|---|
| | | selectdate2: '', |
|---|
| | | tableData: [{}], |
|---|
| | | tableData1:[{}], |
|---|
| | | tableHead2: [{}], |
|---|
| | | tableData2: [{}], |
|---|
| | | show: true, |
|---|
| | | showGlassType: '', |
|---|
| | | showGlassIndex: 0, |
|---|
| | | machineLocal:<%= request.getParameter("local")%>, |
|---|
| | | machineScreen:null, |
|---|
| | | machineElectric:[{}], |
|---|
| | | loading:true, |
|---|
| | | machineIp:null, |
|---|
| | | picture:[{}], |
|---|
| | | pictures:['',''], |
|---|
| | | getPhoto:null |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | echarsInit(type) { |
|---|
| | | let HisArr=[] |
|---|
| | | let datas=this.machineElectric |
|---|
| | | datas=[datas[this.machineLocal]] |
|---|
| | | HisArr[0] = this.$echarts.init(document.getElementById('chart-wrap')); |
|---|
| | | |
|---|
| | | this.val.yAxis[0].name="çµè"; |
|---|
| | | this.val.series[0].name='çµè(kw)' |
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)' |
|---|
| | | danwei="(kw)" |
|---|
| | | |
|---|
| | | for(let i in datas){ |
|---|
| | | this.val.title.text=datas[i]["0_machine_name"]+danwei |
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(','); |
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(','); |
|---|
| | | HisArr[i].setOption(this.val); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | tableData(newdate,olddate){ |
|---|
| | | this.tableData1=[this.tableData[this.machineLocal]] |
|---|
| | | }, |
|---|
| | | machineElectric(){ |
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.echarsInit(0) |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | picture(newval){ |
|---|
| | | this.pictures[0]=newval[0]['A0'] |
|---|
| | | this.pictures[1]=newval[0]['A1'] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | |
|---|
| | | let sql="" |
|---|
| | | let flag=2 |
|---|
| | | sql="{call AXJ_a_largeScreen_order_tableHead_select()}" |
|---|
| | | await this.loadAjxss('大å±æ¾ç¤ºæºå¨è¡¨å¤´æ¥è¯¢',sql,flag,"tableHead") |
|---|
| | | await this.getTableData('ççµæ£æµ') |
|---|
| | | await this.getMachineElectric('ççµæ£æµ','4') |
|---|
| | | |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("ip",this.machineIp); |
|---|
| | | this.getPhoto = await setInterval(()=>{ |
|---|
| | | this.$http.post( '../mysqlInsert/getPicture.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | app.$data.picture= response.data |
|---|
| | | }).catch(function (error) { |
|---|
| | | clearInterval(this.getPhoto); |
|---|
| | | //alert('Error: ' + "æåå¾çåçé误,请å
³éçé¢éæ°æå¼ï¼"); |
|---|
| | | |
|---|
| | | }); |
|---|
| | | },30000) |
|---|
| | | |
|---|
| | | |
|---|
| | | this.onmouseMove() |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | switch (this.machineLocal) { |
|---|
| | | case 0: |
|---|
| | | this.machineScreen=7*1 |
|---|
| | | this.machineIp="192.168.10.196" |
|---|
| | | break; |
|---|
| | | case 1: |
|---|
| | | this.machineScreen=10*1 |
|---|
| | | this.machineIp="192.168.20.51" |
|---|
| | | break; |
|---|
| | | default: |
|---|
| | | this.machineScreen=12*1 |
|---|
| | | this.machineIp="192.168.20.107" |
|---|
| | | break; |
|---|
| | | // |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
|---|
| | | <html>
|
|---|
| | |
|
|---|
| | | <head>
|
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|---|
| | | <meta http-equiv="expires" content="0"> |
|---|
| | | <meta http-equiv="pragma" content="no-cache"> |
|---|
| | | <meta http-equiv="cache-control" content="no-cache"> |
|---|
| | | <title>ä¸çå å</title>
|
|---|
| | | <script src="../js/main.js"></script>
|
|---|
| | | </head>
|
|---|
| | | <style>
|
|---|
| | | * {
|
|---|
| | | margin: 0px;
|
|---|
| | | padding: 0px;
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | body,
|
|---|
| | | html {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | background-color: #D5EAFF;
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #app {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #wai {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 100%;
|
|---|
| | | display: flex;
|
|---|
| | | flex-wrap: wrap;
|
|---|
| | | position: relative;
|
|---|
| | | margin: 0px;
|
|---|
| | | padding: 0px;
|
|---|
| | | justify-content: center;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #wai_shang {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 48%;
|
|---|
| | | display: flex;
|
|---|
| | | flex-wrap: nowrap;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #wai_xia {
|
|---|
| | | width: 100%;
|
|---|
| | | height: 50%;
|
|---|
| | | display: flex;
|
|---|
| | | flex-wrap: nowrap;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .shang_zuo {
|
|---|
| | | height: 100%;
|
|---|
| | | width: 50%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .shang_you {
|
|---|
| | | height: 100%;
|
|---|
| | | width: 50%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .centdv_time {
|
|---|
| | | width: 70%;
|
|---|
| | | height: 10%;
|
|---|
| | | position: relative;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .centdv_time input {
|
|---|
| | | height: 25px;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .btn {
|
|---|
| | | text-align: center;
|
|---|
| | | width: 100px;
|
|---|
| | | height: 29px;
|
|---|
| | | /* outline: none; */
|
|---|
| | | border: none;
|
|---|
| | | background-color: #5CADFE;
|
|---|
| | | box-shadow: 15 8px 16px 15 rgba(0, 0, 0, 0), 15 6px 5px 15 rgba(0, 0, 0, 0.19);
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .msgtab {
|
|---|
| | | width: 99%;
|
|---|
| | | height: 90%;
|
|---|
| | | /* border: 1px solid white; */
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .msgtab1 {
|
|---|
| | | width: 99%;
|
|---|
| | | height: 88%;
|
|---|
| | | /* border: 1px solid white; */
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | .xia_zuo {
|
|---|
| | | height: 100%;
|
|---|
| | | width: 50%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .xia_you {
|
|---|
| | | height: 100%;
|
|---|
| | | width: 50%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #chart-wrap {
|
|---|
| | | width: 90%;
|
|---|
| | | height: 80%;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .title {
|
|---|
| | | color: black;
|
|---|
| | | height: 10%;
|
|---|
| | | font-size: 18px;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .centdv_time {
|
|---|
| | | font-size: 18px;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #tuopan {
|
|---|
| | | width: 80%;
|
|---|
| | | height: 90%;
|
|---|
| | | background-color: #696969;
|
|---|
| | | border-radius: 25px 25px 0 0;
|
|---|
| | | margin: 0 auto;
|
|---|
| | | transform: rotate(180deg);
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #tuopan_jindu {
|
|---|
| | | border-radius: 0 0 25px 25px;
|
|---|
| | | width: 100%;
|
|---|
| | | /* height: 75%; */
|
|---|
| | | background-color: #5CADFE;
|
|---|
| | | transform: rotate(180deg);
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .xptile {
|
|---|
| | | height: 10%;
|
|---|
| | | font-size: 18px;
|
|---|
| | | text-align: center;
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | .jindu {
|
|---|
| | | color: black;
|
|---|
| | | width: 100px;
|
|---|
| | | height: 5%;
|
|---|
| | | font-size: 18px;
|
|---|
| | | position: relative;
|
|---|
| | | top: -55%;
|
|---|
| | | left: 36%
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | #jindu_zhi {
|
|---|
| | | border: none;
|
|---|
| | | background-color: transparent;
|
|---|
| | | height: 100%;
|
|---|
| | | font-size: 18px;
|
|---|
| | | }
|
|---|
| | | </style>
|
|---|
| | |
|
|---|
| | | <body>
|
|---|
| | | <div id="app" @mousemove="onmouseMove" v-loading="loading" element-loading-background="white">
|
|---|
| | | <div id="mains" v-show="this.global.pollingIndex==0">
|
|---|
| | | <div id="wai">
|
|---|
| | | <div id="wai_shang">
|
|---|
| | | <div class="shang_zuo">
|
|---|
| | | <div class="title">
|
|---|
| | | å½åç产信æ¯ï¼
|
|---|
| | |
|
|---|
| | | çå¾
æçæ°ï¼
|
|---|
| | |
|
|---|
| | | å·²å®å·¥æçæ°ï¼
|
|---|
| | |
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <div class="msgtab">
|
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | <div class="shang_you">
|
|---|
| | | <div class="centdv_time">
|
|---|
| | | <el-date-picker style="float: left;margin-bottom: 0.3%;"
|
|---|
| | | v-model="selectDate"
|
|---|
| | | type="daterange"
|
|---|
| | | value-format="yyyy-MM-dd"
|
|---|
| | | range-separator="è³"
|
|---|
| | | start-placeholder="å¼å§æ¥æ"
|
|---|
| | | end-placeholder="ç»ææ¥æ">
|
|---|
| | | </el-date-picker>
|
|---|
| | | |
|---|
| | | <el-button type="primary" icon="el-icon-search"
|
|---|
| | | style="float: left;margin-left: 0.2%;margin-bottom: 0.3%;"
|
|---|
| | | @click="selectSub()" |
|---|
| | | >åå²è®¢åæç´¢</el-button>
|
|---|
| | | </div>
|
|---|
| | | <div class="msgtab1">
|
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableDatas"></show-table>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | </div>
|
|---|
| | | <div id="wai_xia">
|
|---|
| | | <div class="xia_zuo">
|
|---|
| | | <div id="chart-wrap"></div>
|
|---|
| | | </div>
|
|---|
| | | <div class="xia_you">
|
|---|
| | |
|
|---|
| | | <div id="tuopan">
|
|---|
| | | <div id="tuopan_jindu"></div>
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <div class="xptile">å½åä¸çè¿åº¦{{bar}}%</div>
|
|---|
| | | <div class="jindu"><input type="text" id="jindu_zhi" :value="GlassNum+'/'+150"></div>
|
|---|
| | |
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | |
|
|---|
| | | <screen-photo :id="14" :intime="this.global.timer" |
|---|
| | | v-show="this.global.pollingIndex==1"
|
|---|
| | | >
|
|---|
| | | </screen-photo> |
|---|
| | | </div>
|
|---|
| | | </body>
|
|---|
| | | <script>
|
|---|
| | | let app = new Vue({
|
|---|
| | | el: '#app',
|
|---|
| | | mixins: [mixin],
|
|---|
| | | data: {
|
|---|
| | | storage: null,
|
|---|
| | | val: {
|
|---|
| | | title:{
|
|---|
| | | text:'',
|
|---|
| | | left:'center'
|
|---|
| | | },
|
|---|
| | | tooltip: {
|
|---|
| | | trigger: 'axis',
|
|---|
| | | axisPointer: {
|
|---|
| | | type: 'shadow'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | grid: {
|
|---|
| | | left: '3%',
|
|---|
| | | right: '4%',
|
|---|
| | | bottom: '3%',
|
|---|
| | | containLabel: true
|
|---|
| | | },
|
|---|
| | | xAxis: [{
|
|---|
| | | type: 'category',
|
|---|
| | | data: [],
|
|---|
| | | axisLine: {
|
|---|
| | | lineStyle: {
|
|---|
| | | color: 'rgb(30, 144, 255)'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | axisLabel: {
|
|---|
| | | color: 'rgb(30, 144, 255)'
|
|---|
| | | },
|
|---|
| | | splitLine: {
|
|---|
| | | lineStyle: {
|
|---|
| | | color: 'rgb(30, 144, 255)',
|
|---|
| | | type: 'dashed'
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }],
|
|---|
| | | yAxis: [{
|
|---|
| | | type: "value",
|
|---|
| | | name: "è½è",
|
|---|
| | | nameTextStyle: {
|
|---|
| | | color: "rgb(30, 144, 255)",
|
|---|
| | | fontSize: 12,
|
|---|
| | | padding: [0, 0, 0, -30], //nameæåä½ç½® å¯¹åº ä¸å³ä¸å·¦
|
|---|
| | | },
|
|---|
| | | splitLine: {
|
|---|
| | | // ç½æ ¼çº¿
|
|---|
| | | show: false,
|
|---|
| | | lineStyle: { //åå²çº¿
|
|---|
| | | color: "rgb(180, 180, 180)",
|
|---|
| | | width: 1,
|
|---|
| | | type: "dashed" //dottedï¼è线 solid:å®çº¿
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | axisLabel: {
|
|---|
| | | // è½´æå
|
|---|
| | | color: "rgb(30, 144, 255)",
|
|---|
| | | fontSize: 12,
|
|---|
| | | },
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | ],
|
|---|
| | | series: [{
|
|---|
| | | name: 'çµè',
|
|---|
| | | type: 'bar',
|
|---|
| | | barWidth: '80%',
|
|---|
| | | data: [220, 152, 200, 334, 390, 330, 220],
|
|---|
| | | itemStyle: {
|
|---|
| | | color: 'rgb(180, 180, 180)'
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | ]
|
|---|
| | | },
|
|---|
| | | tableHead: [{
|
|---|
| | | 0:'订åå·', 1:'产åä¿¡æ¯', 2:'å·²å å·¥æ°', 3:'å¾
å å·¥æ°', 4:'ç ´ææ°'
|
|---|
| | | }],
|
|---|
| | | selectDate:['',''],
|
|---|
| | | tableData: [{}],
|
|---|
| | | tableDatas: [{}],
|
|---|
| | | show: true,
|
|---|
| | | showGlassType: '',
|
|---|
| | | showGlassIndex: 0,
|
|---|
| | | gao: 50,
|
|---|
| | | machineElectric:[{}],
|
|---|
| | | getGlassNum:null,
|
|---|
| | | GlassNum:null,
|
|---|
| | | bar:null,
|
|---|
| | | loading:true
|
|---|
| | |
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | | echarsInit(type) {
|
|---|
| | | let HisArr=[]
|
|---|
| | | let datas=this.machineElectric
|
|---|
| | | HisArr[0] = this.$echarts.init(document.getElementById('chart-wrap'));
|
|---|
| | | |
|---|
| | | this.val.yAxis[0].name="çµè";
|
|---|
| | | this.val.series[0].name='çµè(kw)'
|
|---|
| | | this.val.series[0].itemStyle.color='rgb(84,112,198)'
|
|---|
| | | danwei="(kw)"
|
|---|
| | | |
|---|
| | | for(let i in datas){
|
|---|
| | | this.val.title.text=this.machineElectric[i]["0_machine_name"]+danwei
|
|---|
| | | this.val.xAxis[0].data=datas[i]["6_shijian"].split(',');
|
|---|
| | | this.val.series[0].data=datas[i]["5_jiqidianliang"].split(',');
|
|---|
| | | HisArr[i].setOption(this.val);
|
|---|
| | | } |
|---|
| | | },
|
|---|
| | | jindu () {
|
|---|
| | | let myDiv = document.getElementById("tuopan_jindu");
|
|---|
| | | myDiv.style.height = this.bar+"%";
|
|---|
| | | |
|---|
| | |
|
|---|
| | | },
|
|---|
| | | selectSub(){
|
|---|
| | | let arrObj={
|
|---|
| | | type:1,
|
|---|
| | | stateData:this.selectDate[0],
|
|---|
| | | endeData:this.selectDate[1]
|
|---|
| | | }
|
|---|
| | | sql="{call AXJ_a_largeScreen_batchOffData_select(?,?,?,?)}~"+JSON.stringify(arrObj)
|
|---|
| | | this.loadAjxss('ä¸ç订ååæ°',sql,2,"tableDatas")
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | },
|
|---|
| | | computed: {
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | | watch:{
|
|---|
| | | machineElectric(){
|
|---|
| | | if(Object.keys(this.machineElectric[0]).length==0){
|
|---|
| | | return |
|---|
| | | }
|
|---|
| | | //this.echarsInit(0)
|
|---|
| | | this.loading=false
|
|---|
| | | },
|
|---|
| | | getGlassNum(newval){
|
|---|
| | | this.GlassNum=newval[0]['0_content_value']%150
|
|---|
| | | this.bar=parseInt(parseInt(this.GlassNum/150*100))
|
|---|
| | | this.jindu()
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | async mounted () {
|
|---|
| | | let sql=""
|
|---|
| | | let flag=2
|
|---|
| | | sql="{call AXJ_a_largeScreen_batchOffHead_select()}"
|
|---|
| | | await this.loadAjxss('ä¸çå å订å',sql,flag,"tableHead")
|
|---|
| | | await this.getMachineElectric('ä¸ç',7)
|
|---|
| | | //this.jindu();
|
|---|
| | | |
|---|
| | | let timer1=await setInterval(()=>{
|
|---|
| | | let arrObj={
|
|---|
| | | type:0,
|
|---|
| | | stateData:'',
|
|---|
| | | endeData:''
|
|---|
| | | }
|
|---|
| | | sql="{call AXJ_a_largeScreen_batchOffData_select(?,?,?,?)}~"+JSON.stringify(arrObj)
|
|---|
| | | this.interValLoadAjxs('ä¸ç订ååæ°',sql,flag,"tableData",timer1)
|
|---|
| | | },5000)
|
|---|
| | | let arrObj={
|
|---|
| | | type:1,
|
|---|
| | | stateData:'',
|
|---|
| | | endeData:''
|
|---|
| | | }
|
|---|
| | | sql="{call AXJ_a_largeScreen_batchOffData_select(?,?,?,?)}~"+JSON.stringify(arrObj)
|
|---|
| | | this.loadAjxss('ä¸ç订ååæ°',sql,flag,"tableDatas")
|
|---|
| | |
|
|---|
| | | sql="{call AXJ_a_largeScreen_batchOffHandNum_select()}"
|
|---|
| | | this.loadAjxss()
|
|---|
| | | |
|---|
| | | let timer2=await setInterval(()=>{
|
|---|
| | | sql="{call AXJ_a_largeScreen_batchOffHandNum_select()}"
|
|---|
| | | this.interValLoadAjxs('ä¸çæºæ¢°ææ°é',sql,flag,"getGlassNum",timer2)
|
|---|
| | | },5000)
|
|---|
| | | this.onmouseMove()
|
|---|
| | |
|
|---|
| | | },
|
|---|
| | |
|
|---|
| | | })
|
|---|
| | |
|
|---|
| | | </script>
|
|---|
| | |
|
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | Vue.component('show-table', { |
|---|
| | | // 声æ props |
|---|
| | | props: ['tablehead','tabledata'], |
|---|
| | | // åæ ·ä¹å¯ä»¥å¨ vm å®ä¾ä¸å "this.message" è¿æ ·ä½¿ç¨ |
|---|
| | | template: `<el-table |
|---|
| | | :data="tabledata" |
|---|
| | | height="100%" |
|---|
| | | style="width: 100%"> |
|---|
| | | <el-table-column |
|---|
| | | |
|---|
| | | v-for="(item,keys,index) in tablehead[0]" |
|---|
| | | :key="index" |
|---|
| | | :label="item" |
|---|
| | | :prop="keys.toString()" |
|---|
| | | > |
|---|
| | | <template v-slot="scope" v-if=" keys=='6_parts_change' "> |
|---|
| | | <el-button |
|---|
| | | :style="tabledata[scope.$index]['6_parts_change']==1?textColor:null" |
|---|
| | | type="text" |
|---|
| | | size="small" |
|---|
| | | @click='openParts(scope.$index,tabledata)' |
|---|
| | | > |
|---|
| | | æ´æ¢ |
|---|
| | | </el-button> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | |
|---|
| | | </el-table>` |
|---|
| | | , |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | textColor:{ |
|---|
| | | color:'orange' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | methods:{ |
|---|
| | | openParts(index,machineData){ |
|---|
| | | this.$parent.$emit('dialogvisible', |
|---|
| | | { |
|---|
| | | 'show':true, |
|---|
| | | 'machineid':machineData[index]['10_id'] |
|---|
| | | } |
|---|
| | | ) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | Vue.component('parts-change', { |
|---|
| | | // 声æ props |
|---|
| | | props: ['machine'], |
|---|
| | | // åæ ·ä¹å¯ä»¥å¨ vm å®ä¾ä¸å "this.message" è¿æ ·ä½¿ç¨ |
|---|
| | | template: `<el-dialog |
|---|
| | | title="æ´æ¢è®¾å¤é¶é¨ä»¶å表" |
|---|
| | | :visible.sync="centerDialogVisible" |
|---|
| | | width="55%" |
|---|
| | | center |
|---|
| | | > |
|---|
| | | <el-table :data="machineChange" width="100%" height='100%'> |
|---|
| | | <el-table-column |
|---|
| | | v-for="(item,keys,index) in machineChangeHead[0]" |
|---|
| | | :prop="keys" |
|---|
| | | :label="item" |
|---|
| | | |
|---|
| | | > |
|---|
| | | <template v-slot="scope" v-if="keys=='4_surpass' && Object.keys(machineChange[0]).length!=0"> |
|---|
| | | <el-button |
|---|
| | | :style="machineChange[scope.$index]['4_surpass']==1?textColor:null" |
|---|
| | | type="text" |
|---|
| | | size="small" |
|---|
| | | v-preventreclick |
|---|
| | | @click="partsChange(scope.$index, machineChange,0)" |
|---|
| | | > |
|---|
| | | æ´æ¢ |
|---|
| | | </el-button> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | <span slot="footer" class="dialog-footer"> |
|---|
| | | <el-button @click="centerDialogVisible = false">å æ¶</el-button> |
|---|
| | | <el-button type="primary" v-if="Object.keys(machineChange[0]).length!=0" v-preventreclick @click="partsChange(0,0,1)">ä¸é®æ´æ¢</el-button> |
|---|
| | | </span> |
|---|
| | | </el-dialog>` |
|---|
| | | , |
|---|
| | | mixins: [mixin], |
|---|
| | | data(){ |
|---|
| | | return{ |
|---|
| | | centerDialogVisible:false, |
|---|
| | | machineChange:[{}], |
|---|
| | | machineChangeHead:[{}], |
|---|
| | | machineId:null, |
|---|
| | | textColor:{ |
|---|
| | | color:'orange' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | partsChange(index,data,type){//ä¿®æ¹é¶é¨ä»¶æ´æ¢å¨æï¼typeï¼ 0代表å个é¶é¨ä»¶ï¼1代表æ¤æºå¨ææé¶é¨ä»¶ |
|---|
| | | |
|---|
| | | let para |
|---|
| | | if(type==0){ |
|---|
| | | para={ |
|---|
| | | id:data[index]['6_id'], |
|---|
| | | machineId:data[index]['5_machine_id'], |
|---|
| | | type:type |
|---|
| | | } |
|---|
| | | }else{ |
|---|
| | | para={ |
|---|
| | | id:0, |
|---|
| | | machineId:this.machineId, |
|---|
| | | type:type |
|---|
| | | } |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_largeScreen_machinePartsChange_update(?,?,?,?)}~"+JSON.stringify(para); |
|---|
| | | this.connects("æ´æ°èæï¼",sql,1,1); |
|---|
| | | this.centerDialogVisible = false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | async machineId(){ |
|---|
| | | let machine={ |
|---|
| | | id:this.machineId |
|---|
| | | } |
|---|
| | | let canshu={ |
|---|
| | | gongneng:'大å±æ´æ¢å¨ææºå¨é¶é¨ä»¶æ¥è¯¢ï¼æºå¨å·ï¼'+this.machineId, |
|---|
| | | sql:"{call AXJ_a_largeScreen_machinePartsChange_select(?,?)}~"+JSON.stringify(machine), |
|---|
| | | flag:2, |
|---|
| | | vals:"machineChange" |
|---|
| | | } |
|---|
| | | this.machineChange=await this.returnloadAjxss(canshu) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let parameter={ |
|---|
| | | gongneng:'大å±æ´æ¢å¨æ表头æ¥è¯¢', |
|---|
| | | sql:"{call AXJ_a_largeScreen_machinePartsChangeHead_select()}", |
|---|
| | | flag:2, |
|---|
| | | vals:"machineChangeHead" |
|---|
| | | } |
|---|
| | | this.machineChangeHead=await this.returnloadAjxss(parameter) |
|---|
| | | |
|---|
| | | this.$parent.$on("dialogvisible",val=>{ |
|---|
| | | //è¿æ¯äºä»¶å½æ° ä¸æ¦changeBgcäºä»¶è¢«è§¦å,å°±ä¼æ§è¡è¿éç代ç |
|---|
| | | this.centerDialogVisible = val.show |
|---|
| | | this.machineId=val.machineid |
|---|
| | | |
|---|
| | | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | Vue.component('screen-order', {//é¢åè´´èä¸ç订åç»ä»¶ |
|---|
| | | // 声æ props |
|---|
| | | props: ['tablehead','tabledata'], |
|---|
| | | // åæ ·ä¹å¯ä»¥å¨ vm å®ä¾ä¸å "this.message" è¿æ ·ä½¿ç¨ |
|---|
| | | template: `<el-table |
|---|
| | | :data="tabledata" |
|---|
| | | height="100%" |
|---|
| | | style="width: 100%"> |
|---|
| | | <el-table-column |
|---|
| | | |
|---|
| | | v-for="(item,keys,index) in tablehead[0]" |
|---|
| | | :key="index" |
|---|
| | | :label="item" |
|---|
| | | :prop="keys.toString()" |
|---|
| | | > |
|---|
| | | <template v-slot="scope" v-if=" keys=='3_ratio' && Object.keys(tabledata[0]).length!=0"> |
|---|
| | | <el-progress :text-inside="true" :stroke-width="26" |
|---|
| | | :percentage="tabledata[scope.$index]['3_ratio']==null?0*1:tabledata[scope.$index]['3_ratio']*1" |
|---|
| | | > |
|---|
| | | </el-progress> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | |
|---|
| | | </el-table>` |
|---|
| | | |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | Vue.component('screen-photo', {//ç°åºä½ä¸å¾è½®æ¢ |
|---|
| | | // 声æ props |
|---|
| | | props: ['id','intime'], |
|---|
| | | // åæ ·ä¹å¯ä»¥å¨ vm å®ä¾ä¸å "this.message" è¿æ ·ä½¿ç¨ |
|---|
| | | template: `<div style='width:100%;height:100%;max-width=100%;max-height=100%;position: relative;'> |
|---|
| | | <img class="imgCenter" :src="url"/> |
|---|
| | | </div>`, |
|---|
| | | mixins: [mixin], |
|---|
| | | data(){ |
|---|
| | | return{ |
|---|
| | | photoList:[{}], |
|---|
| | | indexs:-1, |
|---|
| | | url:null |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | photoList(newVal){ |
|---|
| | | if(Object.keys(this.photoList[0]).length==0){ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.url=newVal[0]['0_route'] |
|---|
| | | setInterval(()=>{ |
|---|
| | | |
|---|
| | | this.indexs>=newVal.length-1?this.indexs=0:this.indexs++ |
|---|
| | | this.url=newVal[this.indexs]['0_route'] |
|---|
| | | },parseInt(this.intime/newVal.length)) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let para={ |
|---|
| | | id:this.id |
|---|
| | | } |
|---|
| | | let canshu={ |
|---|
| | | gongneng:'ç»ä»¶å¾çæ¥è¯¢ï¼', |
|---|
| | | sql:"{call AXJ_a_largeScreen_phtot_select(?,?)}~"+JSON.stringify(para), |
|---|
| | | flag:2, |
|---|
| | | vals:"photoList" |
|---|
| | | } |
|---|
| | | this.photoList=await this.returnloadAjxss(canshu) |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // Vue.prototype.$watch('Vue.prototype.global.errorFlag', function (newVal, oldVal) { |
|---|
| | | // // è¿è¡ååºå¼æä½ |
|---|
| | | // }) |
|---|
| New file |
| | |
|---|
| | | Vue.prototype.global={ |
|---|
| | | polling:null, |
|---|
| | | pollingIndex:0, |
|---|
| | | timer:30000,//触åå®æ¶å¨æ¶é´ |
|---|
| | | errorFlag:0 |
|---|
| | | // getMachineElectricTimer:null, |
|---|
| | | // getTableDataTimer:null, |
|---|
| | | // getMachineWaterTimer:null, |
|---|
| | | |
|---|
| | | } |
|---|
| New file |
| | |
|---|
| | | with(document){ |
|---|
| | | write('<link rel="shortcut icon" href="../img/3.ico" />'); |
|---|
| | | write('<link rel="stylesheet" href="../js/static/css/element.css">'); |
|---|
| | | write('<link rel="stylesheet" href="../js/static/css/style.css">'); |
|---|
| | | |
|---|
| | | write('<script src="../js/static/js/vue.js"></script>'); |
|---|
| | | write('<script src="../js/global.js"></script>'); |
|---|
| | | write('<script src="../js/jquery-3.4.1.min.js"></script>'); |
|---|
| | | write('<script src="../js/axios.min.js"></script>'); |
|---|
| | | |
|---|
| | | |
|---|
| | | write('<script src="../js/mixins.js"></script>'); |
|---|
| | | |
|---|
| | | write('<script src="../js/components.js"></script>'); |
|---|
| | | write('<script src="../js/static/js/element.js"></script>'); |
|---|
| | | write('<script src="../js/static/js/echarts.min.js"></script>'); |
|---|
| | | write('<script >Vue.prototype.$echarts = echarts;Vue.prototype.$http= axios</script>'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | |
|---|
| | | let str = window.location.href.substr(window.location.href.indexOf('?') + 1) |
|---|
| | | let json = new Object() |
|---|
| | | const arr = str.split('&') |
|---|
| | |
|---|
| | | |
|---|
| | | var mixin={ |
|---|
| | | methods:{ |
|---|
| | | connects:function(gongneng,sql,flag,num){ |
|---|
| | | onmouseMove(){//å±å¹é¼ æ 移å¨å¾ªç¯ææ¾ |
|---|
| | | clearInterval(this.global.polling); |
|---|
| | | |
|---|
| | | this.global.polling=setInterval(()=>{ |
|---|
| | | this.global.pollingIndex>=1?this.global.pollingIndex=0:this.global.pollingIndex++ |
|---|
| | | this.$forceUpdate(); |
|---|
| | | },this.global.timer)//æ ¹æ®èªå®ä¹Vueå
¨å±åéè¿è¡æä½ |
|---|
| | | }, |
|---|
| | | async connects(gongneng,sql,flag,num){ |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("gongneng",gongneng); |
|---|
| | | param.append("sql",sql); |
|---|
| | | param.append("flag",flag); |
|---|
| | | param.append("anquanma",json["anquanma"]); |
|---|
| | | param.append("anquanma","anquanma1"); |
|---|
| | | |
|---|
| | | this.$http.post( '../mysqlInsert/mysql.jsp',param) |
|---|
| | | await this.$http.post( '../mysqlInsert/mysql.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | if(num==1){ |
|---|
| | | result=$(response.data).text(); |
|---|
| | | result=response.data; |
|---|
| | | index = result.indexOf("[["); |
|---|
| | | if(index>-1){ |
|---|
| | | if(result.indexOf("[[anquanmaerr]]")>-1){ |
|---|
| | |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | loadAjxss:function(gongneng,sql,flag,vals){ |
|---|
| | | async loadAjxss(gongneng,sql,flag,vals){ |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("yemian","123"); |
|---|
| | | param.append("gongneng",gongneng); |
|---|
| | | param.append("sql",sql); |
|---|
| | | param.append("flag",flag); |
|---|
| | | param.append("anquanma",json["anquanma"]); |
|---|
| | | |
|---|
| | | |
|---|
| | | this.$http.post( '../mysqlInsert/mysql.jsp',param |
|---|
| | | ) |
|---|
| | | |
|---|
| | | param.append("anquanma","anquanma1"); |
|---|
| | | await this.$http.post( '../mysqlInsert/mysql.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | if(flag==2){ |
|---|
| | | let result=$(response.data).text(); |
|---|
| | | let result=response.data; |
|---|
| | | let index = result.indexOf("[{"); |
|---|
| | | if(index>-1){ |
|---|
| | | result=result.substring(index).trim(); |
|---|
| | | app.$data[vals]=JSON.parse(result); |
|---|
| | | app.$data["loading"]=false; |
|---|
| | | console.log(vals+":"); |
|---|
| | | console.log(app.$data[vals]); |
|---|
| | | }else if(result.indexOf("[[anquanmaerr]]")>-1){ |
|---|
| | |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch(function (error) { |
|---|
| | | alert('Error: ' + "æå¡å¨æ°æ®åçé误ï¼"); |
|---|
| | | if(this.global.errorFlag==0){ |
|---|
| | | this.global.errorFlag=1 |
|---|
| | | alert('Error: ' + "æå¡å¨æ°æ®åçé误ï¼") |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | async returnloadAjxss(parameter){//fa |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("yemian","123"); |
|---|
| | | param.append("gongneng",parameter.gongneng); |
|---|
| | | param.append("sql",parameter.sql); |
|---|
| | | param.append("flag",parameter.flag); |
|---|
| | | param.append("anquanma","anquanma1"); |
|---|
| | | |
|---|
| | | let results='' |
|---|
| | | await this.$http.post( '../mysqlInsert/mysql.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | let result=response.data; |
|---|
| | | let index = result.indexOf("[{"); |
|---|
| | | if(index>-1){ |
|---|
| | | result=result.substring(index).trim(); |
|---|
| | | results=JSON.parse(result); |
|---|
| | | console.log(parameter.vals+":"); |
|---|
| | | console.log(results); |
|---|
| | | }else if(result.indexOf("[[anquanmaerr]]")>-1){ |
|---|
| | | //alert('请å
ç»å½åæä½'); |
|---|
| | | window.parent.location.href='../login/index.jsp'; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch(function (error) { |
|---|
| | | if(this.global.errorFlag==0){ |
|---|
| | | this.global.errorFlag=1 |
|---|
| | | alert('Error: ' + "æå¡å¨æ°æ®åçé误ï¼") |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | return results |
|---|
| | | }, |
|---|
| | | async interValLoadAjxs(gongneng,sql,flag,vals,timer){//å®æ¶å¨æ¿æ°æ®æ¥éåæ¸
é¤å®æ¶å¨ |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("yemian","循ç¯æ°æ®"); |
|---|
| | | param.append("gongneng",gongneng); |
|---|
| | | param.append("sql",sql); |
|---|
| | | param.append("flag",flag); |
|---|
| | | param.append("anquanma","anquanma1"); |
|---|
| | | await this.$http.post( '../mysqlInsert/mysql.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | if(flag==2){ |
|---|
| | | let result=response.data |
|---|
| | | let index = result.indexOf("[{"); |
|---|
| | | if(index>-1){ |
|---|
| | | result=result.substring(index).trim(); |
|---|
| | | app.$data[vals]=JSON.parse(result); |
|---|
| | | console.log(vals+":"); |
|---|
| | | console.log(app.$data[vals]); |
|---|
| | | }else if(result.indexOf("[[anquanmaerr]]")>-1){ |
|---|
| | | //alert('请å
ç»å½åæä½'); |
|---|
| | | window.parent.location.href='../login/index.jsp'; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | .catch( (error)=> { |
|---|
| | | clearInterval(timer) |
|---|
| | | if(this.global.errorFlag==0){ |
|---|
| | | this.global.errorFlag=1 |
|---|
| | | alert('Error: ' + "æå¡å¨æ°æ®åçé误ï¼") |
|---|
| | | window.location.reload() |
|---|
| | | } |
|---|
| | | // if(this.global.getTableDataTimer){ |
|---|
| | | // clearInterval(this.global.getTableDataTimer) |
|---|
| | | // } |
|---|
| | | // if(this.global.getMachineElectricTimer){ |
|---|
| | | // clearInterval(this.global.getMachineElectricTimer) |
|---|
| | | // } |
|---|
| | | // if(this.global.getMachineWaterTimer){ |
|---|
| | | // clearInterval(this.global.getMachineWaterTimer) |
|---|
| | | // } |
|---|
| | | //alert('Error: ' + "æå¡å¨æ°æ®åçé误ï¼") |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | async getTableData(machineType){//大å±æ¾ç¤º æ¥è¯¢è®¢åæ°æ® |
|---|
| | | //this.global.getTableDataTimer= |
|---|
| | | let getTableDataTimer=await setInterval(()=>{ |
|---|
| | | let canshu={ |
|---|
| | | machineType:machineType,//æºå¨ç±»å |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_largeScreen_order_machineType_select(?,?)}~"+JSON.stringify(canshu); |
|---|
| | | this.interValLoadAjxs('表æ°æ®æ¥è¯¢',sql,2,"tableData",getTableDataTimer) |
|---|
| | | },5000) |
|---|
| | | }, |
|---|
| | | async getMachineElectric(machineType,group){//大å±æ¾ç¤º æ¥è¯¢æºå¨ç¨çµé |
|---|
| | | //this.global.getMachineElectricTimer= |
|---|
| | | let getMachineElectricTimer=await setInterval(()=>{ |
|---|
| | | let canshu={ |
|---|
| | | machineType:machineType,//æºå¨ç±»å |
|---|
| | | group:group //çµè¡¨ç»å« |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_largeScreen_electric_select(?,?,?)}~"+JSON.stringify(canshu); |
|---|
| | | this.interValLoadAjxs('大å±æ¾ç¤ºé»åæ¥è¯¢',sql,2,"machineElectric",getMachineElectricTimer) |
|---|
| | | },5000) |
|---|
| | | }, |
|---|
| | | async getMachineWater(machineType,group){ |
|---|
| | | //this.global.getMachineWaterTimer= |
|---|
| | | let getMachineWaterTimer=await setInterval(()=>{ |
|---|
| | | let canshu={ |
|---|
| | | machineType:machineType,//æºå¨ç±»å |
|---|
| | | group:group //水表ç»å« |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_largeScreen_water_select(?,?,?)}~"+JSON.stringify(canshu); |
|---|
| | | this.interValLoadAjxs('大å±æ¾ç¤ºé»å水表æ¥è¯¢',sql,2,"machineWater",getMachineWaterTimer) |
|---|
| | | },5000) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | //gongneng:èªå®ä¹ï¼sqlåå¨è¿ç¨ï¼flagæ å¿(0,æ¯ç¨å¼ å·¥ä¹ååè½æå
¥ï¼1åå¨è¿ç¨æ¥è¯¢ï¼2åå¨è¿ç¨æå
¥)ï¼valsï¼vueédataåæ° |
|---|
| | | function loadAjxs(gongneng,sql,flag,vals){ |
|---|
| | | |
|---|
| | | |
|---|
| | | $.post("../mysqlInsert/mysql.jsp", |
|---|
| | | {"yemian":"123","gongneng":gongneng,"sql":sql,'flag':flag,'anquanma':json["anquanma"]}, |
|---|
| | | function loadAjxs(gongneng,sql,flag,vals){ |
|---|
| | | $.post("../mysqlInsert/mysql.jsp", |
|---|
| | | {"yemian":"123","gongneng":gongneng,"sql":sql,'flag':flag,'anquanma':"anquanma1"}, |
|---|
| | | function(result){ |
|---|
| | | if(flag==2){ |
|---|
| | | result=$(result).text(); |
|---|
| | |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| New file |
| | |
|---|
| | | .el-dialog__body{ |
|---|
| | | height: 40vh; |
|---|
| | | overflow: auto; |
|---|
| | | } |
|---|
| | | #app,#mains{ |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | *{ |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | |
|---|
| | | #app{ |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | background-color: bule; |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | #divHead,#left,#main,.shelf{ |
|---|
| | | box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); |
|---|
| | |
|---|
| | | } |
|---|
| | | *{ |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | #mains{ |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | *{ |
|---|
| | | padding: 0%; |
|---|
| | | margin: 0%; |
|---|
| | | } |
|---|
| | | .imgCenter{ |
|---|
| | | max-width: 100%; |
|---|
| | | max-height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | bottom: 0; |
|---|
| | | margin: auto; |
|---|
| | | } |
|---|
| | | .el-dialog__body{ |
|---|
| | | height: 40vh; |
|---|
| | | overflow: auto; |
|---|
| | | } |
|---|
| | |
|---|
| | | Vue.prototype.global={ |
|---|
| | | polling:null, |
|---|
| | | pollingIndex:0, |
|---|
| | | timer:30000 |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | let str = window.location.href.substr(window.location.href.indexOf('?') + 1) |
|---|
| | | let json = new Object() |
|---|
| | |
|---|
| | | }, |
|---|
| | | connects:function(gongneng,sql,flag,num){ |
|---|
| | | $.ajax({ |
|---|
| | | url :'http://localhost:8080/gmms/mysqlInsert/mysql.jsp', |
|---|
| | | url :'../mysqlInsert/mysql.jsp', |
|---|
| | | type : "post",//ä¸å±éäºget |
|---|
| | | data:{"gongneng":gongneng,"sql":sql,'flag':flag,'anquanma':json["anquanma"]}, |
|---|
| | | async : true, |
|---|
| | |
|---|
| | | } |
|---|
| | | //gongneng:èªå®ä¹ï¼sqlåå¨è¿ç¨ï¼flagæ å¿(0,æ¯ç¨å¼ å·¥ä¹ååè½æå
¥ï¼1åå¨è¿ç¨æ¥è¯¢ï¼2åå¨è¿ç¨æå
¥)ï¼valsï¼vueédataåæ° |
|---|
| | | function loadAjxs1(gongneng,sql,flag,vals){ |
|---|
| | | $.post("localhost:8080/gmms/mysqlInsert/mysql.jsp", |
|---|
| | | $.post("../mysqlInsert/mysql.jsp", |
|---|
| | | {"yemian":"123","gongneng":gongneng,"sql":sql,'flag':flag,'anquanma':json["anquanma"]}, |
|---|
| | | function(result){ |
|---|
| | | if(flag==2){ |
|---|
| | |
|---|
| | | |
|---|
| | | function loadAjxs(gongneng,sql,flag,vals){ |
|---|
| | | $.ajax({ |
|---|
| | | url :'http://localhost:8080/gmms/mysqlInsert/mysql.jsp', |
|---|
| | | url :'../mysqlInsert/mysql.jsp', |
|---|
| | | type : "GET",//ä¸å±éäºget |
|---|
| | | data:{"yemian":"123","gongneng":gongneng,"sql":sql,'flag':flag,'anquanma':json["anquanma"]}, |
|---|
| | | async : true, |
|---|
| | |
|---|
| | | return Vue; |
|---|
| | | |
|---|
| | | })); |
|---|
| | | Vue.directive('preventreclick', { |
|---|
| | | |
|---|
| | | Vue.directive('preventreclick', {//é²æ¢éå¤ç¹å» |
|---|
| | | inserted(el, binding) { |
|---|
| | | el.addEventListener('click', () => { |
|---|
| | | if (!el.disabled) { |
|---|
| | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| | | <title>设置æé</title> |
|---|
| | | <%-- <link rel="stylesheet" href="${ctx}/pp/css/baobiaoyangshi.css"> --%> |
|---|
| | | <script src="../../js/jquery-3.4.1.js"></script> |
|---|
| | | <script src="../../js/jquery-3.4.1.min.js"></script> |
|---|
| | | <link rel="stylesheet" href="../../css/quanxiang.css"> |
|---|
| | | |
|---|
| | | <style> |
|---|
| | |
|---|
| | | top:55px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | <script src="../../js/jquery-3.4.1.js"></script> |
|---|
| | | <script src="../../js/jquery-3.4.1.min.js"></script> |
|---|
| | | <link rel="stylesheet" href="../../css/quanxiang.css"> |
|---|
| | | <link rel="shortcut icon" href="../../img/3.ico" /> |
|---|
| | | |
|---|
| | |
|---|
| | | /* if(true){ */ |
|---|
| | | if(coun!=0){ |
|---|
| | | out.println("<iframe id='top' height='10%' width='100%' src='shuoming.jsp?adminid="+adminid+"&xingming="+xingming+"&dengji="+dengji+"&anquanma="+anquanma+"&yuyan="+yuyan+"' frameborder='0'></iframe>"); |
|---|
| | | out.println("<iframe id='left' height='90%' width='13%' style='float: left;' src='quanxian.jsp?adminid="+adminid+"&anquanma="+anquanma+"&yuyan="+yuyan+"' frameborder='0'></iframe>"); |
|---|
| | | out.println("<iframe id='left' height='90%' width='13%' style='float: left;overflow-y: hidden;' src='quanxian.jsp?adminid="+adminid+"&anquanma="+anquanma+"&yuyan="+yuyan+"' frameborder='0'></iframe>"); |
|---|
| | | |
|---|
| | | } |
|---|
| | | else{ |
|---|
| | |
|---|
| | | else{ |
|---|
| | | out.print("<script type='text/javascript'>alert('å®å
¨ç æ æ')</script>"); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | else{ |
|---|
| | | out.print("<script type='text/javascript'>alert('ç¨æ·åæè
å¯ç é误')</script>"); |
|---|
| | |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> |
|---|
| | | <link rel="stylesheet" href="../js/static/css/element.css"> |
|---|
| | | <link rel="stylesheet" href="../js/static/css/style.css"> |
|---|
| | | <script src="../js/static/js/vue.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <!-- import JavaScript --> |
|---|
| | | <script src="../js/static/js/element.js"></script> |
|---|
| | | <script src="../js/static/js/echarts.min.js"></script> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | <style type="text/css"> |
|---|
| | | <style> |
|---|
| | | .el-table .warning-row { |
|---|
| | |
|---|
| | | <title>Insert title here</title> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" style="display:width:100%"> |
|---|
| | | <% |
|---|
| | | String a=null; |
|---|
| | | try{ |
|---|
| | | a=Manager.getDevice().toString(); |
|---|
| | | } |
|---|
| | | catch(Exception e){ |
|---|
| | | a="[{}]"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | %> |
|---|
| | | <div id="app" style="width:100%"> |
|---|
| | | <el-table border |
|---|
| | | :data="machine" |
|---|
| | | height='700' |
|---|
| | | height='100%' |
|---|
| | | style="width: 100%;" |
|---|
| | | :cell-class-name="tableRowClassName" |
|---|
| | | > |
|---|
| | |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data:{ |
|---|
| | | machine:<%out.print( Manager.getDevice().toString());%>, |
|---|
| | | machine:<%= a%>, |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | tableRowClassName({row,column,rowIndex,columnIndex}) { |
|---|
| New file |
| | |
|---|
| | | <%@page import="builder.Manager"%> |
|---|
| | | <%@page import="ng.db.*"%> |
|---|
| | | <%@ page language="java" import="java.sql.*" contentType="text/html; charset=UTF-8" |
|---|
| | | pageEncoding="UTF-8"%> |
|---|
| | | <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> |
|---|
| | | <script src="../static/js/ng/tb-2.0.js"></script> |
|---|
| | | |
|---|
| | | <title>Insert title here</title> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="tab" style="display:width:100%"> |
|---|
| | | </div> |
|---|
| | | <script type="text/javascript"> |
|---|
| | | var a= |
|---|
| | | <% |
|---|
| | | // Manager.appStart(null); |
|---|
| | | out.print( Manager.getDevice().toString()); |
|---|
| | | |
|---|
| | | %>; |
|---|
| | | console.log(a); |
|---|
| | | |
|---|
| | | var opt={ |
|---|
| | | table:{ |
|---|
| | | trStyles:["background-color:none","background-color:lightblue"], |
|---|
| | | style:"width:100%", |
|---|
| | | border:1, |
|---|
| | | notify:function(message){ |
|---|
| | | if(message.data.st!="å·²è¿æ¥"){ |
|---|
| | | |
|---|
| | | message.tr.children[3].style["color"]="red"; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | columns:[ |
|---|
| | | { |
|---|
| | | name:"设å¤å", |
|---|
| | | binding:"name" |
|---|
| | | |
|---|
| | | }, |
|---|
| | | |
|---|
| | | { |
|---|
| | | name:"IP", |
|---|
| | | binding:"ip" |
|---|
| | | |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name:"port", |
|---|
| | | binding:"port", |
|---|
| | | } |
|---|
| | | |
|---|
| | | , |
|---|
| | | { |
|---|
| | | name:"ç¶æ", |
|---|
| | | binding:"st" |
|---|
| | | } |
|---|
| | | , |
|---|
| | | { |
|---|
| | | name:"è°ç¨æ¬¡æ°", |
|---|
| | | binding:"count" |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | var tab=createTable(document.getElementById("tab"),opt); |
|---|
| | | tab.update(a); |
|---|
| | | tab.notify(); |
|---|
| | | </script> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| | |
|---|
| | | |
|---|
| | | |
|---|
| | | <%@include file="mysqlconnect.jsp"%> |
|---|
| | | <body style='background-color:#D5EAFF'> |
|---|
| | | <body style='background-color:#D5EAFF;overflow-y:hidden'> |
|---|
| | | <!--主页é¢å·¦ä¾§èåæ å®ç°--> |
|---|
| | | |
|---|
| | | <div class="menu" > |
|---|
| | |
|---|
| | | Connection con=DriverManager.getConnection( urlglass,user,password); |
|---|
| | | |
|---|
| | | CallableStatement cs = con.prepareCall("{call mokuai(?,?,?)}"); |
|---|
| | | id="A001"; |
|---|
| | | id=request.getParameter("adminid"); |
|---|
| | | cn="cn"; |
|---|
| | | cs.setString(1, id); |
|---|
| | | cs.setString(2, cn); |
|---|
| | |
|---|
| | | while(rs.next()) |
|---|
| | | { |
|---|
| | | |
|---|
| | | |
|---|
| | | mid=rs.getInt(1); |
|---|
| | | String mokuainame=rs.getString(2); |
|---|
| | | out.println("<div class='menu_title'>"+mokuainame+"<span class='indicator' id='indicator'>â¼</span></div><ul class='test'>"); |
|---|
| | |
|---|
| | | <%@page import="builder.Manager"%> |
|---|
| | | <%@page import="toTcp.TcpMain"%> |
|---|
| | | <%@include file="../mysqlInsert/mysql_connect.jsp"%> |
|---|
| | | <% |
|---|
| | | TcpMain.getElectric(); |
|---|
| | | Manager.appStart(new String[]{url,user,password }); |
|---|
| | | response.sendRedirect("bdg.jsp"); |
|---|
| | | %> |
|---|
| New file |
| | |
|---|
| | | <%@page import="ng.db.*,java.util.LinkedHashMap,java.util.ArrayList,java.util.LinkedList"%> |
|---|
| | | <%@page import="com.alibaba.fastjson.JSON,com.alibaba.fastjson.JSONObject,com.alibaba.fastjson.JSONArray,com.alibaba.fastjson.parser.Feature"%> |
|---|
| | | <% |
|---|
| | | if(request.getParameter("ip")!=null ){ |
|---|
| | | |
|---|
| | | try{ |
|---|
| | | ArrayList<String> result=getFtpData.getImg(request.getParameter("ip")); |
|---|
| | | LinkedHashMap<String, String> results = new LinkedHashMap<String, String>(); |
|---|
| | | results.put("A0", String.valueOf(result.get(0))); |
|---|
| | | results.put("A1", String.valueOf(result.get(1))); |
|---|
| | | LinkedList<String> resultss = new LinkedList<String>(); |
|---|
| | | resultss.add(JSON.toJSONString(results)); |
|---|
| | | out.print(resultss); |
|---|
| | | }catch(Exception e){ |
|---|
| | | out.print("[{}]"); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | %> |
|---|
| | |
|---|
| | | response.setContentType("text/html; charset=utf-8"); |
|---|
| | | response.setHeader("Access-Control-Allow-Origin","*"); |
|---|
| | | %> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <%@include file="mysql_connect.jsp"%> |
|---|
| | | <%@page import="java.util.LinkedHashMap"%> |
|---|
| | | <%@page import="java.util.HashMap"%> |
|---|
| | |
|---|
| | | String sltcSql =request.getParameter("sql"); |
|---|
| | | String anquanma=request.getParameter("anquanma"); |
|---|
| | | try{ |
|---|
| | | |
|---|
| | | Class.forName(driverClass);{ |
|---|
| | | Connection conAnquan=DriverManager.getConnection( urlglass,user,password); |
|---|
| | | |
|---|
| | | //éè¿connectionæ°æ®åºé¾æ¥å¯¹è±¡ å建ä¸ä¸ªstatement对象æ°æ®åºæä½å¯¹è±¡ |
|---|
| | | /* Connection conAnquan=DriverManager.getConnection( urlglass,user,password); |
|---|
| | | Statement stmts=conAnquan.createStatement(); |
|---|
| | | //æ§è¡sqlè¯å¥ |
|---|
| | | SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss SSS"); |
|---|
| | | Date time = new Date(); |
|---|
| | | long timestamp = time.getTime() / 1000L; |
|---|
| | |
|---|
| | | { |
|---|
| | | coun++; |
|---|
| | | } |
|---|
| | | conAnquan.close(); |
|---|
| | | rss.close(); |
|---|
| | | stmts.close(); |
|---|
| | | conAnquan.close(); */ |
|---|
| | | //coun>0 |
|---|
| | | if(true){ |
|---|
| | | Connection con=DriverManager.getConnection( url,user,password); |
|---|
| | |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | cs.close(); |
|---|
| | | }else{ |
|---|
| | | Statement stmtss=con.createStatement(); |
|---|
| | | |
|---|
| | | stmtss.execute(sltcSql); |
|---|
| | | stmtss.close(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | con.close(); |
|---|
| | | }else{ |
|---|
| | | out.print("[[anquanmaerr]]"); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }catch(Exception e){ |
|---|
| | | Class.forName(driverClass);{ |
|---|
| | | Connection con=DriverManager.getConnection(url,user,password); |
|---|
| | | CallableStatement bs =con.prepareCall("{call AXJ_err(?,?,?)}"); |
|---|
| | | bs.setString(1, e.toString()); |
|---|
| | | bs.setString(2, gongneng); |
|---|
| | | bs.setString(3, sltcSql+','+anquanma); |
|---|
| | | bs.setString(3, sltcSql); |
|---|
| | | bs.execute(); |
|---|
| | | bs.close(); |
|---|
| | | con.close(); |
|---|
| | | } |
|---|
| | | out.print("[['åçæªç¥é误ï¼è¯·èç³»ç¸å
³äººå']]"); |
|---|
| | | out.print("[['åçæªç¥é误ï¼è¯·èç³»ç¸å
³äººå']]"); |
|---|
| | | } |
|---|
| | | %> |
|---|
| | | </body> |
|---|
| | | </html> |
|---|
| | | %> |
|---|
| | |
|---|
| | | |
|---|
| | | <% |
|---|
| | | //è¿æ¥æ°æ®åº |
|---|
| | | String ip="localhost"; |
|---|
| | | String driverClass = "com.mysql.cj.jdbc.Driver"; |
|---|
| | | String url="jdbc:mysql://10.153.19.150/gmms?serverTimezone=GMT%2B8"; |
|---|
| | | String url="jdbc:mysql://"+ip+"/gmms?serverTimezone=GMT%2B8"; |
|---|
| | | String user = "root"; |
|---|
| | | String password = "beibo.123/"; |
|---|
| | | String url1 = "jdbc:mysql://10.153.19.150/gmms"; |
|---|
| | | String url1 = "jdbc:mysql://"+ip+"/gmms"; |
|---|
| | | |
|---|
| | | String urlglass="jdbc:mysql://10.153.19.150/mesgglass?serverTimezone=GMT%2B8"; |
|---|
| | | String url3="jdbc:mysql://10.153.19.150/glog?serverTimezone=GMT%2B8"; |
|---|
| | | String urlglass="jdbc:mysql://"+ip+"/mesgglass?serverTimezone=GMT%2B8"; |
|---|
| | | String url3="jdbc:mysql://"+ip+"/glog?serverTimezone=GMT%2B8"; |
|---|
| | | |
|---|
| | | /* localhost:3307 */ |
|---|
| | | |
|---|
| New file |
| | |
|---|
| | | |
|---|
| | | <%@include file="mysql_connect.jsp"%> |
|---|
| | | <%@page import="java.util.LinkedHashMap"%> |
|---|
| | | <%@page import="java.util.HashMap"%> |
|---|
| | | <%@page import="java.util.LinkedList"%> |
|---|
| | | <%@page import="com.alibaba.fastjson.JSON,com.alibaba.fastjson.JSONObject,com.alibaba.fastjson.JSONArray,com.alibaba.fastjson.parser.Feature"%> |
|---|
| | | <%@ page import="java.text.SimpleDateFormat,java.util.Date" %> |
|---|
| | | <%@page import="druidConnect.JDBCUtils.*,java.sql.Connection"%> |
|---|
| | | |
|---|
| | | <% |
|---|
| | | String gongneng = request.getParameter("gongneng"); |
|---|
| | | String yemian = request.getParameter("yemian"); |
|---|
| | | String sltcSql =request.getParameter("sql"); |
|---|
| | | String anquanma=request.getParameter("anquanma"); |
|---|
| | | Connection con = druidConnect.JDBCUtils.getConnection(); |
|---|
| | | CallableStatement cs =null; |
|---|
| | | try{ |
|---|
| | | |
|---|
| | | if(true){ |
|---|
| | | String flag=""; |
|---|
| | | //sltcSql="{call AXJ_a_largeScreen_glassCut_select()}"; |
|---|
| | | flag=request.getParameter("flag"); |
|---|
| | | String[] sql=sltcSql.split("~"); |
|---|
| | | cs = con.prepareCall(sql[0]); |
|---|
| | | if(sql.length>1){ |
|---|
| | | HashMap<String ,String> hp = JSON.parseObject(sql[1], LinkedHashMap.class,Feature.OrderedField); |
|---|
| | | int indexNum=1; |
|---|
| | | for(String key : hp.keySet()) { |
|---|
| | | cs.setString(indexNum, String.valueOf(hp.get(key))); |
|---|
| | | //out.print("cs.setString("+indexNum+", "+String.valueOf(hp.get(key))+")"); |
|---|
| | | indexNum++; |
|---|
| | | } |
|---|
| | | cs.registerOutParameter( indexNum , java.sql.Types.LONGNVARCHAR); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | if(flag.equals("2")){ |
|---|
| | | ResultSet rs = cs.executeQuery(); |
|---|
| | | ResultSetMetaData rsmd = rs.getMetaData(); |
|---|
| | | String[] arr; |
|---|
| | | LinkedList<String> results = new LinkedList<String>(); |
|---|
| | | |
|---|
| | | while(rs.next()){ |
|---|
| | | LinkedHashMap<String, String> result = new LinkedHashMap<String, String>(); |
|---|
| | | for(int i=0;i<rsmd.getColumnCount();i++){ |
|---|
| | | // out.println(rsmd.getColumnName(i+1));String.valueOf(i) |
|---|
| | | String val=rs.getString(i+1)!=null?String.valueOf(rs.getString(i+1)):""; |
|---|
| | | result.put(String.valueOf(i+"_"+rsmd.getColumnName(i+1)),val); |
|---|
| | | } |
|---|
| | | String jsonStr = JSON.toJSONString(result); |
|---|
| | | results.add(jsonStr); |
|---|
| | | } |
|---|
| | | if(results.size()<1){ |
|---|
| | | results.add("{}"); |
|---|
| | | } |
|---|
| | | out.print(results); |
|---|
| | | |
|---|
| | | }else{ |
|---|
| | | cs.execute(); |
|---|
| | | String fanhui=(String) cs.getString("fanhui"); |
|---|
| | | // out.print("[["+cs.getString("fanhui").length()+","+cs.getString("fanhui")+"]]"); |
|---|
| | | if(cs.getString("fanhui")!=null){ |
|---|
| | | if(fanhui.length()>0 && !fanhui.equals("null")){ |
|---|
| | | out.print("[["+cs.getString("fanhui")+"]]"); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | }catch(Exception e){ |
|---|
| | | cs =con.prepareCall("{call AXJ_err(?,?,?)}"); |
|---|
| | | cs.setString(1, e.toString()); |
|---|
| | | cs.setString(2, gongneng); |
|---|
| | | cs.setString(3, sltcSql+','+anquanma); |
|---|
| | | cs.execute(); |
|---|
| | | |
|---|
| | | out.print("[['åçæªç¥é误ï¼è¯·èç³»ç¸å
³äººå']]"); |
|---|
| | | }finally { |
|---|
| | | druidConnect.JDBCUtils.close(cs, con); |
|---|
| | | } |
|---|
| | | %> |
|---|
| | |
|---|
| | | <%@page import="builder.Manager"%> |
|---|
| | | <%@page import="ng.devices.HexUtil"%> |
|---|
| | | <%@page import="ng.db.sendOptFile"%> |
|---|
| | | <% |
|---|
| | | |
|---|
| | | <<<<<<< HEAD |
|---|
| | | String zt=request.getParameter("zt"); |
|---|
| | | String peifanhao=request.getParameter("peifanhao"); |
|---|
| | | String changpinghao=request.getParameter("changpinghao"); |
|---|
| | | |
|---|
| | | Manager.sendtoPLC(76,20,4,new byte[]{0,1,0,1},0); |
|---|
| | | Manager.sendtoPLC(77,20,4,new byte[]{0,1,0,1},0); |
|---|
| | | ======= |
|---|
| | | String zt=request.getParameter("zt"); |
|---|
| | | String peifanhao=request.getParameter("peifanhao"); |
|---|
| | | String way_of_working=request.getParameter("way_of_working"); |
|---|
| | | String thickness=request.getParameter("thickness"); |
|---|
| | | String glass_type=request.getParameter("glass_type"); |
|---|
| | | String production_type=request.getParameter("production_type"); |
|---|
| | | |
|---|
| | | int zts =Integer.valueOf(zt); |
|---|
| | | int peifanhaos =Integer.valueOf(peifanhao); |
|---|
| | | |
|---|
| | | /* Manager.sendtoPLC(76,20,4,new byte[]{0,1,0,zt},0); |
|---|
| | | |
|---|
| | | String a=HexUtil.intTo2ByteHex(peifanhaos)+HexUtil.intTo2ByteHex(0); |
|---|
| | | String as=HexUtil.intTo2ByteHex(peifanhaos)+HexUtil.intTo2ByteHex(0)+HexUtil.intTo2ByteHex(0); |
|---|
| | | String b=HexUtil.intTo2ByteHex(0)+HexUtil.intTo2ByteHex(1); |
|---|
| | | String bs=HexUtil.intTo2ByteHex(0)+HexUtil.intTo2ByteHex(0)+HexUtil.intTo2ByteHex(1); |
|---|
| | | |
|---|
| | | String ganghua=HexUtil.intTo2ByteHex(Integer.valueOf(way_of_working)) |
|---|
| | | +HexUtil.intTo2ByteHex(Integer.valueOf(thickness))+HexUtil.intTo2ByteHex(Integer.valueOf(glass_type)) |
|---|
| | | +HexUtil.intTo2ByteHex(Integer.valueOf(production_type)); |
|---|
| | | |
|---|
| | | String ganghuas=HexUtil.intTo2ByteHex(0) |
|---|
| | | +HexUtil.intTo2ByteHex(0)+HexUtil.intTo2ByteHex(0) |
|---|
| | | +HexUtil.intTo2ByteHex(0); |
|---|
| | | /* Manager.sendtoPLC(76,20,4,new byte[]{0,(byte)(peifanhaos&0xff),0,zt},0); |
|---|
| | | Manager.sendtoPLC(77,20,4,new byte[]{0,1,0,zt},0); */ |
|---|
| | | if(zts==2){ |
|---|
| | | Manager.sendtoPLC(76,20,4,new byte[]{0,(byte)(peifanhaos&0xff),0,0},0); |
|---|
| | | }else if(zts==3){ |
|---|
| | | Manager.sendtoPLC(76,20,4,new byte[]{0,0,0,0},0); |
|---|
| | | } |
|---|
| | | >>>>>>> 09a05342f4c60c834c3ee17a13529cd91c624f34 |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | if(zts==2){ |
|---|
| | | Manager.dayin(1,changpinghao); |
|---|
| | | //æ°çæº |
|---|
| | | Manager.sendtoPLC(5,88,4,a,0); |
|---|
| | | //æºæ¢°æ |
|---|
| | | Manager.sendtoPLC(6,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(45,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(46,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(47,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(48,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(49,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(50,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(51,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(52,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(53,88,4,a,0); |
|---|
| | | //ç£¨è¾¹æº |
|---|
| | | Manager.sendtoPLC(7,88,4,a,0); |
|---|
| | | //åè§æº |
|---|
| | | Manager.sendtoPLC(9,88,4,a,9400); |
|---|
| | | |
|---|
| | | //é»åæº |
|---|
| | | Manager.sendtoPLC(11,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(31,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(32,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(33,88,4,a,0); |
|---|
| | | //æ°´å |
|---|
| | | Manager.sendtoPLC(12,176,6,as,0); |
|---|
| | | Manager.sendtoPLC(34,176,6,as,0); |
|---|
| | | Manager.sendtoPLC(35,176,6,as,0); |
|---|
| | | Manager.sendtoPLC(36,176,6,as,0); |
|---|
| | | //å å·¥ä¸å¿ |
|---|
| | | Manager.sendtoPLC(14,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(37,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(38,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(39,88,4,a,0); |
|---|
| | | //æ¯çº¿åçå° |
|---|
| | | Manager.sendtoPLC(13,236,4,a,0); |
|---|
| | | //ä¸å°çå¹² |
|---|
| | | Manager.sendtoPLC(19,88,4,a,10000); |
|---|
| | | Manager.sendtoPLC(20,88,4,a,10000); |
|---|
| | | Manager.sendtoPLC(21,88,4,a,10000); |
|---|
| | | Manager.sendtoPLC(22,88,4,a,10000); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(23,88,4,a,0); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(24,26,8,ganghua,0); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(25,88,4,a,0); |
|---|
| | | //è´´è |
|---|
| | | Manager.sendtoPLC(26,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(76,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(77,88,4,a,0); |
|---|
| | | sendOptFile.sendOpt("\\\\192.168.10.25\\optfile/", "file://localhost/d/optfile/"); |
|---|
| | | }else if(zts==3){ |
|---|
| | | Manager.dayin(2,changpinghao); |
|---|
| | | //æ°çæº |
|---|
| | | Manager.sendtoPLC(5,88,4,b,0); |
|---|
| | | //æºæ¢°æ |
|---|
| | | Manager.sendtoPLC(6,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(45,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(46,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(47,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(48,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(49,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(50,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(51,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(52,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(53,88,4,b,0); |
|---|
| | | //ç£¨è¾¹æº |
|---|
| | | Manager.sendtoPLC(7,88,4,b,0); |
|---|
| | | //åè§æº |
|---|
| | | Manager.sendtoPLC(9,88,4,b,9400); |
|---|
| | | |
|---|
| | | //é»åæº |
|---|
| | | Manager.sendtoPLC(11,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(31,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(32,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(33,88,4,b,0); |
|---|
| | | //æ°´å |
|---|
| | | Manager.sendtoPLC(12,176,6,bs,0); |
|---|
| | | Manager.sendtoPLC(34,176,6,bs,0); |
|---|
| | | Manager.sendtoPLC(35,176,6,bs,0); |
|---|
| | | Manager.sendtoPLC(36,176,6,bs,0); |
|---|
| | | //å å·¥ä¸å¿ |
|---|
| | | Manager.sendtoPLC(14,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(37,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(38,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(39,88,4,b,0); |
|---|
| | | //æ¯çº¿åçå° |
|---|
| | | Manager.sendtoPLC(13,236,4,b,0); |
|---|
| | | //ä¸å°çå¹² |
|---|
| | | Manager.sendtoPLC(19,88,4,b,10000); |
|---|
| | | Manager.sendtoPLC(20,88,4,b,10000); |
|---|
| | | Manager.sendtoPLC(21,88,4,b,10000); |
|---|
| | | Manager.sendtoPLC(22,88,4,b,10000); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(23,88,4,b,0); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(24,26,8,ganghuas,0); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(25,88,4,b,0); |
|---|
| | | //è´´è |
|---|
| | | Manager.sendtoPLC(26,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(76,88,4,b,0); |
|---|
| | | Manager.sendtoPLC(77,88,4,b,0); |
|---|
| | | } else if(zts==98){ |
|---|
| | | //æ°çæº |
|---|
| | | Manager.sendtoPLC(5,88,4,a,0); |
|---|
| | | //æºæ¢°æ |
|---|
| | | Manager.sendtoPLC(6,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(45,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(46,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(47,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(48,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(49,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(50,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(51,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(52,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(53,88,4,a,0); |
|---|
| | | //ç£¨è¾¹æº |
|---|
| | | Manager.sendtoPLC(7,88,4,a,0); |
|---|
| | | //åè§æº |
|---|
| | | Manager.sendtoPLC(9,88,4,a,9400); |
|---|
| | | |
|---|
| | | //é»åæº |
|---|
| | | Manager.sendtoPLC(11,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(31,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(32,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(33,88,4,a,0); |
|---|
| | | //æ°´å |
|---|
| | | Manager.sendtoPLC(12,176,6,as,0); |
|---|
| | | Manager.sendtoPLC(34,176,6,as,0); |
|---|
| | | Manager.sendtoPLC(35,176,6,as,0); |
|---|
| | | Manager.sendtoPLC(36,176,6,as,0); |
|---|
| | | //å å·¥ä¸å¿ |
|---|
| | | Manager.sendtoPLC(14,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(37,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(38,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(39,88,4,a,0); |
|---|
| | | //æ¯çº¿åçå° |
|---|
| | | Manager.sendtoPLC(13,236,4,a,0); |
|---|
| | | //ä¸å°çå¹² |
|---|
| | | Manager.sendtoPLC(19,88,4,a,10000); |
|---|
| | | Manager.sendtoPLC(20,88,4,a,10000); |
|---|
| | | Manager.sendtoPLC(21,88,4,a,10000); |
|---|
| | | Manager.sendtoPLC(22,88,4,a,10000); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(23,88,4,a,0); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(24,26,8,ganghua,0); |
|---|
| | | //é¢å |
|---|
| | | Manager.sendtoPLC(25,88,4,a,0); |
|---|
| | | //è´´è |
|---|
| | | Manager.sendtoPLC(26,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(76,88,4,a,0); |
|---|
| | | Manager.sendtoPLC(77,88,4,a,0); |
|---|
| | | |
|---|
| | | } |
|---|
| | | else if(zts==99){ |
|---|
| | | Manager.dayin(1,changpinghao); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | %> |
|---|
| New file |
| | |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <html lang="en"> |
|---|
| | | <head> |
|---|
| | | <meta charset="UTF-8"> |
|---|
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|---|
| | | <title>Document</title> |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app"> |
|---|
| | | <el-container> |
|---|
| | | <el-header> |
|---|
| | | <el-date-picker |
|---|
| | | v-model="dateSelect" |
|---|
| | | type="datetimerange" |
|---|
| | | :picker-options="pickerOptions" |
|---|
| | | range-separator="è³" |
|---|
| | | start-placeholder="å¼å§æ¥æ" |
|---|
| | | end-placeholder="ç»ææ¥æ" |
|---|
| | | align="right" |
|---|
| | | value-format="yyyy-MM-dd HH:mm:ss" |
|---|
| | | > |
|---|
| | | |
|---|
| | | </el-date-picker> |
|---|
| | | |
|---|
| | | <el-input style="width: 175px;" |
|---|
| | | placeholder="请è¾å
¥æºå¨ID" |
|---|
| | | v-model="machineid" |
|---|
| | | clearable> |
|---|
| | | </el-input> |
|---|
| | | </el-header> |
|---|
| | | <el-main style="height: 90vh;"> |
|---|
| | | <show-table :tablehead="tableHead" :tabledata="tableData"></show-table> |
|---|
| | | |
|---|
| | | </el-main> |
|---|
| | | </el-container> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | <script> |
|---|
| | | let app= new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data(){ |
|---|
| | | return{ |
|---|
| | | pickerOptions: { |
|---|
| | | shortcuts: [{ |
|---|
| | | text: 'æè¿ä¸å¨', |
|---|
| | | onClick(picker) { |
|---|
| | | const end = new Date(); |
|---|
| | | const start = new Date(); |
|---|
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); |
|---|
| | | picker.$emit('pick', [start, end]); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | text: 'æè¿ä¸ä¸ªæ', |
|---|
| | | onClick(picker) { |
|---|
| | | const end = new Date(); |
|---|
| | | const start = new Date(); |
|---|
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); |
|---|
| | | picker.$emit('pick', [start, end]); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | text: 'æè¿ä¸ä¸ªæ', |
|---|
| | | onClick(picker) { |
|---|
| | | const end = new Date(); |
|---|
| | | const start = new Date(); |
|---|
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); |
|---|
| | | picker.$emit('pick', [start, end]); |
|---|
| | | } |
|---|
| | | }] |
|---|
| | | }, |
|---|
| | | dateSelect:["",""], |
|---|
| | | machineid:"", |
|---|
| | | tableData:[{}], |
|---|
| | | tableHead:[{ |
|---|
| | | "0_machine_id":'æºå¨ID', |
|---|
| | | "1_machine_name":'æºå¨å称', |
|---|
| | | "2_jishu":'产é', |
|---|
| | | "3_tingji":'åæºæ¶é´' |
|---|
| | | }] |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | }, |
|---|
| | | async mounted() { |
|---|
| | | let timer1=await setInterval(()=>{ |
|---|
| | | let arrObj={ |
|---|
| | | machineid:this.machineid, |
|---|
| | | stateData:this.dateSelect[0], |
|---|
| | | endeData:this.dateSelect[1] |
|---|
| | | } |
|---|
| | | sql="{call glog.datetimeMachineGlassSum(?,?,?,?)}~"+JSON.stringify(arrObj) |
|---|
| | | this.interValLoadAjxs('产éæ¥è¯¢',sql,2,"tableData",timer1) |
|---|
| | | },5000) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
| | |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" > |
|---|
| | | <el-container v-loading="loading" > |
|---|
| | | <el-container v-loading="loading" style="width:100%;height:100%" > |
|---|
| | | <el-header style="margin-top: 3%;height: 3%;"> |
|---|
| | | <el-button @click="showFlagFuc" type="primary" round style="float:right;">{{showFlag==false?'è¿å订å':'æ°å¢è®¢å'}}</el-button> |
|---|
| | | <el-date-picker v-show="showFlag" style="float: left;margin-bottom: 0.3%;" |
|---|
| | |
|---|
| | | type="daterange" |
|---|
| | | range-separator="è³" |
|---|
| | | start-placeholder="å¼å§æ¥æ" |
|---|
| | | end-placeholder="ç»ææ¥æ"> |
|---|
| | | end-placeholder="ç»ææ¥æ" |
|---|
| | | value-format="yyyy-MM-dd" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | |
|---|
| | | <el-button @click="selectTimeOrder" v-show="showFlag" type="primary" icon="el-icon-search" |
|---|
| | |
|---|
| | | </el-button> |
|---|
| | | |
|---|
| | | </el-header> |
|---|
| | | <el-main > |
|---|
| | | <el-main style="width:100%;height:97%"> |
|---|
| | | <el-table v-show="showFlag" |
|---|
| | | :data="orderData" |
|---|
| | | max-height="600" |
|---|
| | | height="95%" |
|---|
| | | style="width: 100%;"> |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | ä¿®æ¹ |
|---|
| | | </el-button> |
|---|
| | | <el-button |
|---|
| | | v-if="orderData[scope.$index]['11_order_status']>1" |
|---|
| | | v-if="orderData[scope.$index]['11_order_status']==2" |
|---|
| | | @click.native.prevent="open(scope.$index, orderData)" |
|---|
| | | type="text" |
|---|
| | | size="small"> |
|---|
| | |
|---|
| | | <script src="../js/jquery-3.4.1.min.js"></script> |
|---|
| | | |
|---|
| | | <script src="../js/static/js/vue.js"></script> |
|---|
| | | <script src="../js/global.js"></script> |
|---|
| | | <script src="../js/axios.min.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <!-- import JavaScript --> |
|---|
| | |
|---|
| | | ruleForm: { |
|---|
| | | produceid:"", |
|---|
| | | glassNum:"", |
|---|
| | | creator:'<%= request.getParameter("xingming") %>' |
|---|
| | | creator:'', |
|---|
| | | }, |
|---|
| | | rules: { |
|---|
| | | produceid: [ |
|---|
| | |
|---|
| | | if (!valid) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | this.ruleForm.creator='<%= request.getParameter("xingming")%>'; |
|---|
| | | let sql="{call AXJ_a_order_add(?,?,?,?)}~"+JSON.stringify(this.ruleForm); |
|---|
| | | this.connects("订åæ°å¢",sql,1,1); |
|---|
| | | }); |
|---|
| | |
|---|
| | | if (!valid) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | this.ruleForm.creator='<%= request.getParameter("xingming")%>'; |
|---|
| | | let updateGlassObj=this.ruleForm |
|---|
| | | updateGlassObj.id=this.updateOrder.id |
|---|
| | | |
|---|
| | | let sql="{call AXJ_a_order_update(?,?,?,?,?)}~"+JSON.stringify(updateGlassObj); |
|---|
| | | this.connects("产åä¿®æ¹",sql,1,1); |
|---|
| | | this.connects("订åä¿®æ¹",sql,1,1); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | |
|---|
| | | let sql="{call AXJ_a_order_updateState(?,?,?)}~"+JSON.stringify(updateState); |
|---|
| | | this.connects("订åç¶æå®¡æ ¸ä¿®æ¹",sql,1,1); |
|---|
| | | }, |
|---|
| | | selectSub:function(){ |
|---|
| | | async selectSub(){ |
|---|
| | | let arrObj={} |
|---|
| | | let arrFlag=0 |
|---|
| | | for(let i in this.slectOrder){ |
|---|
| | |
|---|
| | | sql="{call AXJ_a_order_select_into()}" |
|---|
| | | } |
|---|
| | | this.loading=true |
|---|
| | | this.loadAjxss('订åæ¥è¯¢',sql,2,"orderData") |
|---|
| | | await this.loadAjxss('订åæ¥è¯¢',sql,2,"orderData") |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | selectTimeOrder:function(){ |
|---|
| | | async selectTimeOrder(){ |
|---|
| | | let arrObj={} |
|---|
| | | for(let i in this.slectOrder){ |
|---|
| | | arrObj[i]='n*' |
|---|
| | |
|---|
| | | sql="{call AXJ_a_order_select_into()}" |
|---|
| | | } |
|---|
| | | this.loading=true |
|---|
| | | this.loadAjxss('订åæ¥è¯¢',sql,2,"orderData") |
|---|
| | | //loadAjxs('产åæ¥è¯¢',sql,2,"orderData") |
|---|
| | | await this.loadAjxss('订åæ¥è¯¢',sql,2,"orderData") |
|---|
| | | this.loading=false |
|---|
| | | |
|---|
| | | }, |
|---|
| | | open(index,row) {//æå¼åºç ´çé¢ |
|---|
| | |
|---|
| | | computed:{ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | async mounted() { |
|---|
| | | let sql="{call AXJ_a_order_select_into()}" |
|---|
| | | let flag=2; |
|---|
| | | this.loadAjxss('订ååå§æ¥è¯¢',sql,flag,"orderData") |
|---|
| | | await this.loadAjxss('订ååå§æ¥è¯¢',sql,flag,"orderData") |
|---|
| | | |
|---|
| | | /* loadAjxs('订ååå§æ¥è¯¢',sql,flag,"orderData") */ |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_orderHeader_select()}" |
|---|
| | | loadAjxs('订å表头',sql,flag,"tableHead") |
|---|
| | | await this.loadAjxss('订å表头',sql,flag,"tableHead") |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_order_produce_select()}" |
|---|
| | | loadAjxs('订å产åæ¥è¯¢',sql,flag,"orderProduce") |
|---|
| | | await this.loadAjxss('订å产åæ¥è¯¢',sql,flag,"orderProduce") |
|---|
| | | this.loading=false |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | |
|---|
| | | <meta charset="UTF-8"> |
|---|
| | | <!-- import CSS --> |
|---|
| | | <link rel="stylesheet" href="../js/static/css/element.css"> |
|---|
| | | <link rel="stylesheet" href="../js/static/css/style.css"> |
|---|
| | | <!-- <link rel="stylesheet" href="../js/static/css/style.css"> --> |
|---|
| | | <style > |
|---|
| | | html,body{ |
|---|
| | | width: 99%; |
|---|
| | | height: 99%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | padding: 0%; |
|---|
| | | margin: auto; |
|---|
| | | text-align: center; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | #app{ |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | #divHead,#left,#main,.shelf{ |
|---|
| | | box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); |
|---|
| | | } |
|---|
| | | input::-webkit-outer-spin-button, |
|---|
| | | input::-webkit-inner-spin-button { |
|---|
| | | -webkit-appearance: none; |
|---|
| | | } |
|---|
| | | *{ |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | #mains{ |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | .page-scroll { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" > |
|---|
| | | <el-container > |
|---|
| | | <el-container style="width:100%;height:100%" > |
|---|
| | | <el-header style="height: 3%;"> |
|---|
| | | <el-button @click="showFlagFuc" type="primary" round style="float:left;">{{showFlag==false?'è¿å产å':'æ·»å 产å'}}</el-button> |
|---|
| | | </el-header> |
|---|
| | | <el-main > |
|---|
| | | <el-main style="width:100%;height:97%" > |
|---|
| | | <el-table v-show="showFlag" |
|---|
| | | :data="produceData" |
|---|
| | | max-height="600" |
|---|
| | | height="100%" |
|---|
| | | style="width: 100%;"> |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | :key="index" |
|---|
| | | :label="item" |
|---|
| | | > |
|---|
| | | <el-table-column :prop="keys" v-if="index==0"> |
|---|
| | | <el-table-column :prop="keys" v-if="index==0" > |
|---|
| | | <template slot-scope="scope" v-if="Object.keys(produceData[0]).length!=0"> |
|---|
| | | <el-button |
|---|
| | | @click.native.prevent="updateRow(scope.$index, produceData)" |
|---|
| | |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | <!-- æ°å¢ä¿®æ¹ --> |
|---|
| | | <div v-show="updateShowFlag" style="width: 30%;float: left;margin-top: 10%;margin-left: 10%; "> |
|---|
| | | <div v-show="updateShowFlag" style="width: 30%;height: 50vh;float: left;margin-top: 10%;margin-left: 10%; "> |
|---|
| | | <img :src="ruleForm.route" > |
|---|
| | | </div> |
|---|
| | | |
|---|
| | |
|---|
| | | <script src="../js/jquery-3.4.1.min.js"></script> |
|---|
| | | <script src="../js/axios.min.js"></script> |
|---|
| | | <script src="../js/static/js/vue.js"></script> |
|---|
| | | <script src="../js/global.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <!-- import JavaScript --> |
|---|
| | | <script src="../js/static/js/element.js"></script> |
|---|
| | |
|---|
| | | } |
|---|
| | | this.ruleForm.creator='<%= request.getParameter("xingming") %>'; |
|---|
| | | let sql="{call AXJ_a_produce_insert(?,?,?,?,?,?,?,?,?)}~"+JSON.stringify(this.ruleForm); |
|---|
| | | this.connects("æ°å¢äº§å",sql,1,1); |
|---|
| | | this.connects("æ°å¢äº§å",sql,1,1); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | resetForm(formName) { |
|---|
| | |
|---|
| | | arrObj[i]=this.selectGlass[i] |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_produce_select(?,?,?,?,?,?,?,?,?)}~"+JSON.stringify(arrObj); |
|---|
| | | loadAjxs('产åæ¥è¯¢',sql,2,"produceData"); |
|---|
| | | this.loadAjxss('产åæ¥è¯¢',sql,2,"produceData"); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | computed:{ |
|---|
| | |
|---|
| | | mounted() { |
|---|
| | | let sql="{call AXJ_a_produce_select_into()}"; |
|---|
| | | let flag=2; |
|---|
| | | loadAjxs('产ååå§æ¥è¯¢',sql,flag,"produceData"); |
|---|
| | | this.loadAjxss('产ååå§æ¥è¯¢',sql,flag,"produceData"); |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_produceHeader_select()}"; |
|---|
| | | loadAjxs('产å表头',sql,flag,"tableHead"); |
|---|
| | | this.loadAjxss('产å表头',sql,flag,"tableHead"); |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_optFile_select()}"; |
|---|
| | | loadAjxs('产åoptç¼ç æ¥è¯¢',sql,flag,"optList"); |
|---|
| | | this.loadAjxss('产åoptç¼ç æ¥è¯¢',sql,flag,"optList"); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| New file |
| | |
|---|
| | | <%@ page contentType="text/html;charset=UTF-8"%> |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <html> |
|---|
| | | <head> |
|---|
| | | <meta charset="UTF-8"> |
|---|
| | | <!-- import CSS --> |
|---|
| | | <link rel="stylesheet" href="../js/static/css/element.css"> |
|---|
| | | <!-- <link rel="stylesheet" href="../js/static/css/style.css"> --> |
|---|
| | | <style > |
|---|
| | | html,body{ |
|---|
| | | width: 99%; |
|---|
| | | height: 99%; |
|---|
| | | background-color: #D5EAFF; |
|---|
| | | padding: 0%; |
|---|
| | | margin: auto; |
|---|
| | | text-align: center; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | #app{ |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | #divHead,#left,#main,.shelf{ |
|---|
| | | box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); |
|---|
| | | } |
|---|
| | | input::-webkit-outer-spin-button, |
|---|
| | | input::-webkit-inner-spin-button { |
|---|
| | | -webkit-appearance: none; |
|---|
| | | } |
|---|
| | | *{ |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | #mains{ |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | padding: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | .page-scroll { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .page-scroll .el-scrollbar__wrap { |
|---|
| | | overflow-x: hidden; |
|---|
| | | } |
|---|
| | | img{ |
|---|
| | | width: auto; |
|---|
| | | height: auto; |
|---|
| | | max-width: 100%; |
|---|
| | | max-height: 100%; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | <div id="app" v-loading="loading" element-loading-background="white" > |
|---|
| | | <el-container style="width:100%;height:100%" > |
|---|
| | | <el-header style="height: 3%;"> |
|---|
| | | <el-button @click="showFlagFuc" type="primary" round style="float:left;">{{showFlag==false?'è¿å':'æ·»å ä½ä¸å¾'}}</el-button> |
|---|
| | | </el-header> |
|---|
| | | <el-main style="width:100%;height:97%" > |
|---|
| | | <el-table v-show="showFlag" |
|---|
| | | :data="produceData" |
|---|
| | | height="100%" |
|---|
| | | style="width: 100%;"> |
|---|
| | | |
|---|
| | | |
|---|
| | | <el-table-column |
|---|
| | | v-for="(item,keys,index) in tableHead[0]" |
|---|
| | | :key="index" |
|---|
| | | :label="item" |
|---|
| | | |
|---|
| | | > |
|---|
| | | <el-table-column :prop="keys" v-if="index==0" > |
|---|
| | | <template slot-scope="scope" v-if="Object.keys(produceData[0]).length!=0"> |
|---|
| | | <el-button |
|---|
| | | @click.native.prevent="updateRow(scope.$index, produceData)" |
|---|
| | | type="text" |
|---|
| | | size="small"> |
|---|
| | | ä¿®æ¹ |
|---|
| | | </el-button> |
|---|
| | | |
|---|
| | | <el-button |
|---|
| | | @click.native.prevent="updateRow1(scope.$index, produceData)" |
|---|
| | | type="text" |
|---|
| | | size="small"> |
|---|
| | | ä½åº |
|---|
| | | </el-button> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | |
|---|
| | | <el-table-column :prop="keys" v-if="index>0"> |
|---|
| | | |
|---|
| | | </el-table-column> |
|---|
| | | |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | <!-- æ°å¢ä¿®æ¹ --> |
|---|
| | | <div v-show="updateShowFlag" style="width: 30%;height: 50vh;float: left;margin-top: 10%;margin-left: 10%; "> |
|---|
| | | <img :src="ruleForm.route" > |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <el-form v-show="!showFlag" :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm" style="width: 25%;float: right;margin-right: 20%;"> |
|---|
| | | <el-form-item> |
|---|
| | | <el-button v-show="updateShowFlag" type="primary" @click="updateGlassSub('ruleForm')" v-preventReClick ='3000'>ä¿®æ¹</el-button> |
|---|
| | | <el-button v-show="!updateShowFlag" type="primary" @click="submitForm('ruleForm')" v-preventReClick='3000'>æ交</el-button> |
|---|
| | | <el-button @click="resetForm('ruleForm')">éç½®</el-button> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <el-form-item label="大å±éæ©" prop="optNum"> |
|---|
| | | <template> |
|---|
| | | <el-select v-model="ruleForm.optNum" placeholder="请éæ©" clearable filterable> |
|---|
| | | <el-option |
|---|
| | | v-for="item in optList" |
|---|
| | | :key="item['0_screen_id']" |
|---|
| | | :label="item['2_screen']" |
|---|
| | | :value="item['0_screen_id']"> |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </template> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | <el-form-item label="ä½ä¸å¾çä¸ä¼ " prop="route" > |
|---|
| | | <el-upload |
|---|
| | | :limit="1" |
|---|
| | | :on-change="changeFile" |
|---|
| | | class="upload-demo" |
|---|
| | | ref="upload" |
|---|
| | | action="https://jsonplaceholder.typicode.com/posts/" |
|---|
| | | :file-list="fileList" |
|---|
| | | :auto-upload="false"> |
|---|
| | | <el-button slot="trigger" size="small" type="primary" >éåæ件</el-button> |
|---|
| | | <div slot="tip" class="el-upload__tip">åªè½ä¸ä¼ jpg/pngæ件ï¼ä¸ä¸è¶
è¿5m</div> |
|---|
| | | </el-upload> |
|---|
| | | </el-form-item> |
|---|
| | | |
|---|
| | | </el-form> |
|---|
| | | |
|---|
| | | </el-main> |
|---|
| | | <!-- <el-footer style="background-color: azure;"></el-footer> --> |
|---|
| | | </el-container> |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | <!-- import Vue before Element --> |
|---|
| | | <script src="../js/jquery-3.4.1.min.js"></script> |
|---|
| | | |
|---|
| | | <script src="../js/static/js/vue.js"></script> |
|---|
| | | <script src="../js/axios.min.js"></script> |
|---|
| | | |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <script src="../js/global.js"></script> |
|---|
| | | <!-- import JavaScript --> |
|---|
| | | <script src="../js/static/js/element.js"></script> |
|---|
| | | <script src="../js/static/js/echarts.min.js"></script> |
|---|
| | | |
|---|
| | | <script > |
|---|
| | | //import * as echarts from '../js/echarts.min.js'; |
|---|
| | | Vue.prototype.$echarts = echarts |
|---|
| | | Vue.prototype.$http= axios |
|---|
| | | let app =new Vue({ |
|---|
| | | el: '#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data(){ |
|---|
| | | var checkNum = (rule, value, callback) => { |
|---|
| | | if (!value) { |
|---|
| | | return callback(new Error('ä¸è½ä¸ºç©º')); |
|---|
| | | } |
|---|
| | | setTimeout(() => { |
|---|
| | | let reg = new RegExp(`^[0-9]{1,4}(\.[0-9]{0,2})?$`) |
|---|
| | | |
|---|
| | | if (!reg.test(value)) { |
|---|
| | | callback(new Error('请è¾å
¥0.01-9999.99çæ°å')); |
|---|
| | | }else { |
|---|
| | | callback(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, 1000); |
|---|
| | | }; |
|---|
| | | var checkString = (rule, value, callback) => { |
|---|
| | | if (!value) { |
|---|
| | | return callback(new Error('ä¸è½ä¸ºç©º')); |
|---|
| | | } |
|---|
| | | setTimeout(() => { |
|---|
| | | // if (value.length>255) { |
|---|
| | | // callback(new Error('æ大é¿åº¦255')); |
|---|
| | | // }else { |
|---|
| | | // callback(); |
|---|
| | | // } |
|---|
| | | callback(); |
|---|
| | | }, 1000); |
|---|
| | | }; |
|---|
| | | var checkThickness = (rule, value, callback) => { |
|---|
| | | if (!value) { |
|---|
| | | return callback(new Error('ä¸è½ä¸ºç©ºæè
0')); |
|---|
| | | } |
|---|
| | | setTimeout(() => { |
|---|
| | | let reg = new RegExp(`^[0-9]*[1-9][0-9]*$`) |
|---|
| | | |
|---|
| | | if (!reg.test(value)) { |
|---|
| | | callback(new Error('请è¾å
¥æ£æ´æ°çå度')); |
|---|
| | | }else { |
|---|
| | | callback(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, 1000); |
|---|
| | | }; |
|---|
| | | return { |
|---|
| | | ruleForm: { |
|---|
| | | optNum:'', |
|---|
| | | route:'', |
|---|
| | | photoName:'' |
|---|
| | | }, |
|---|
| | | rules: { |
|---|
| | | optNum: [ |
|---|
| | | { validator: checkString, trigger: 'blur' } |
|---|
| | | ], |
|---|
| | | route: [ |
|---|
| | | { validator: checkString, trigger: 'blur' } |
|---|
| | | ], |
|---|
| | | |
|---|
| | | }, |
|---|
| | | tableHead:[], |
|---|
| | | produceData:[], |
|---|
| | | showFlag:true, |
|---|
| | | updateShowFlag:false, |
|---|
| | | updateGlass:{ |
|---|
| | | id:'' |
|---|
| | | }, |
|---|
| | | optList:[], |
|---|
| | | fileList:[], |
|---|
| | | selectGlass:["","","","","","","",""], |
|---|
| | | loading:true, |
|---|
| | | |
|---|
| | | |
|---|
| | | }; |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | submitForm(formName) { |
|---|
| | | this.$refs[formName].validate((valid) => { |
|---|
| | | if (!valid) { |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_largeScreen_phtot_insert(?,?,?,?)}~"+JSON.stringify(this.ruleForm); |
|---|
| | | this.connects("æ°å¢ç°åºä½ä¸å¾",sql,1,1) |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | resetForm(formName) { |
|---|
| | | this.$refs[formName].resetFields(); |
|---|
| | | }, |
|---|
| | | showFlagFuc(){ |
|---|
| | | Object.keys(this.ruleForm).forEach((key) => (this.ruleForm[key] = '')); |
|---|
| | | this.showFlag=!this.showFlag |
|---|
| | | this.updateShowFlag=false; |
|---|
| | | }, |
|---|
| | | updateRow(index,row){//ä¿®æ¹äº§åæ°æ®æ¾ç¤º |
|---|
| | | this.showFlag=!this.showFlag |
|---|
| | | this.updateShowFlag=true; |
|---|
| | | let rowObj=row[index] |
|---|
| | | this.ruleForm.optNum=rowObj["1_screen_id"] |
|---|
| | | this.ruleForm.route=rowObj["4_route"] |
|---|
| | | this.ruleForm.photoName=rowObj["3_photo_name"] |
|---|
| | | this.updateGlass.id=rowObj["0_id"] |
|---|
| | | }, |
|---|
| | | updateRow1(index,row){//ä¿®æ¹äº§åæ°æ®æ¾ç¤º |
|---|
| | | |
|---|
| | | if(!confirm("确认ä½åºå¤§å±æ件")){ |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | let rowObj=row[index] |
|---|
| | | this.updateGlass.id=rowObj["0_id"] |
|---|
| | | let sql="{call AXJ_a_largeScreen_phtot_delete(?,?)}~"+JSON.stringify(this.updateGlass); |
|---|
| | | this.connects("大å±ä½ä¸å¾ä½åº",sql,1,1); |
|---|
| | | }, |
|---|
| | | updateGlassSub(formName){ |
|---|
| | | this.$refs[formName].validate((valid) => { |
|---|
| | | if (!valid) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | let updateGlassObj=this.ruleForm |
|---|
| | | updateGlassObj.id=this.updateGlass.id |
|---|
| | | |
|---|
| | | let sql="{call AXJ_a_largeScreen_phtot_update(?,?,?,?,?)}~"+JSON.stringify(updateGlassObj); |
|---|
| | | this.connects("大å±ä½ä¸å¾ä¿®æ¹",sql,1,1); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | changeFile(file){//æ·»å æ件触åçæbase64æ件 |
|---|
| | | const isJPG = file.raw.type === 'image/jpeg' || file.raw.type === 'image/png' ; |
|---|
| | | const isLt2M = file.size / 1024 / 1024 < 5; |
|---|
| | | |
|---|
| | | if (!isJPG) { |
|---|
| | | this.$message.error('ä¸ä¼ 头åå¾çåªè½æ¯ JPGæè
PNG æ ¼å¼!') |
|---|
| | | this.$refs.upload.clearFiles() |
|---|
| | | return |
|---|
| | | } |
|---|
| | | if (!isLt2M) { |
|---|
| | | this.$message.error('ä¸ä¼ 头åå¾ç大å°ä¸è½è¶
è¿ 5MB!') |
|---|
| | | this.$refs.upload.clearFiles() |
|---|
| | | return |
|---|
| | | } |
|---|
| | | |
|---|
| | | return new Promise((resolve, reject) => { |
|---|
| | | let reader = new FileReader(); |
|---|
| | | console.log(file.raw.name); |
|---|
| | | reader.readAsDataURL(file.raw); |
|---|
| | | reader.onload = (e) => { |
|---|
| | | resolve(e.target.result); |
|---|
| | | |
|---|
| | | this.ruleForm.route=e.target.result; |
|---|
| | | this.ruleForm.photoName=file.raw.name; |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | selectSub:function(){ |
|---|
| | | let arrObj={} |
|---|
| | | for(let i in this.selectGlass){ |
|---|
| | | arrObj[i]=this.selectGlass[i] |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_a_produce_select(?,?,?,?,?,?,?,?,?)}~"+JSON.stringify(arrObj); |
|---|
| | | this.loadAjxss('产åæ¥è¯¢',sql,2,"produceData"); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | computed:{ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | watch:{ |
|---|
| | | produceData(){ |
|---|
| | | this.loading=false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | let sql="{call AXJ_a_largeScreen_phtotList_select()}"; |
|---|
| | | let flag=2; |
|---|
| | | this.loadAjxss('产ååå§æ¥è¯¢',sql,flag,"produceData"); |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_phtotHead_select()}"; |
|---|
| | | this.loadAjxss('产å表头',sql,flag,"tableHead"); |
|---|
| | | |
|---|
| | | sql="{call AXJ_a_largeScreen_phtotScreenList_select()}"; |
|---|
| | | this.loadAjxss('ä½ä¸å¾å¤§å±å表',sql,flag,"optList"); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
| | |
|---|
| | | <div id='app'> |
|---|
| | | <!-- <div style='height:20px;width:300px;background-color:#3C8DBC;float:right;'><span style = 'color:#fff;' >æ
éæ
åµ:</span><span id='infos'></span></div> --> |
|---|
| | | <section class="content-header" style="padding: 0px 15px 0 15px;"> |
|---|
| | | <h1>订åä»»å¡ <small></small></h1> |
|---|
| | | <h1 @dblclick="dangqianpeifang()">订åä»»å¡ </h1> |
|---|
| | | |
|---|
| | | <ol class="breadcrumb"> |
|---|
| | | |
|---|
| | |
|---|
| | | </tr> |
|---|
| | | </thead> |
|---|
| | | <tbody> |
|---|
| | | <tr v-for="item in shuzu"> |
|---|
| | | <tr v-for="item in shuzu" style="height: 51px;"> |
|---|
| | | <td>{{item['1_order_id']}}</td> |
|---|
| | | <td>{{item['2_original_width']}}</td> |
|---|
| | | <td>{{item['3_original_height']}}</td> |
|---|
| | |
|---|
| | | </td> |
|---|
| | | <td v-else-if="item['11_order_status']==2"> |
|---|
| | | |
|---|
| | | <button @click="dainjishijian('ç»æä»»å¡',item['0_id'])" style='background-color: #5CADFE' class='btn btn-large btn-success' >ç»æä»»å¡</button> |
|---|
| | | <button @click="dainjishijian('ç»æä»»å¡',item['0_id'])" style='background-color: red' class='btn btn-large btn-success' >ç»æä»»å¡</button> |
|---|
| | | |
|---|
| | | <button @click="dainjishijian('åæ¶ä»»å¡',item['0_id'])" style='background-color: #5CADFE' class='btn btn-large btn-success' >åæ¶ä»»å¡</button> |
|---|
| | | </td> |
|---|
| | |
|---|
| | | </form> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | |
|---|
| | | <div class="modal fade" id="modify-infos" tabindex="-1" role="dialog" |
|---|
| | | aria-labelledby="myModalLabel" aria-hidden="true" style="height: 600px;"> |
|---|
| | | |
|---|
| | | <div class="modal-dialog" > |
|---|
| | | <div class="modal-content" > |
|---|
| | | <table class="table table-striped table-hover" |
|---|
| | | style="overflow-x: auto;font-size: 12px;"> |
|---|
| | | <thead> |
|---|
| | | <tr> |
|---|
| | | <th>æºå¨ç¼å·</th> |
|---|
| | | <th>æºå¨å称</th> |
|---|
| | | <th>é
æ¹ç±»å</th> |
|---|
| | | <th>é
æ¹å¼</th> |
|---|
| | | |
|---|
| | | </tr> |
|---|
| | | </thead> |
|---|
| | | <tbody> |
|---|
| | | <tr v-for="item in shuzu2"> |
|---|
| | | <td>{{item['0_id']}}</td> |
|---|
| | | <td>{{item['1_machine_name']}}</td> |
|---|
| | | <td>{{item['2_class_html']}}</td> |
|---|
| | | <td>{{item['3_content_value']}}</td> |
|---|
| | | |
|---|
| | | </tr> |
|---|
| | | </tbody> |
|---|
| | | </table> |
|---|
| | | <div class="modal-footer"> |
|---|
| | | <button type="button" class="btn btn-default btn-lg" |
|---|
| | | data-dismiss="modal">å
³é</button> |
|---|
| | | <button v-if="peifanhao[0]['0_recipe_no']!=null" id="tiebiaoji" @click="peifangxiafa(2)" type="button" class="btn btn-primary btn-lg" |
|---|
| | | id="tiebiaoji">è´´æ æºæ°æ®ä¸å</button> |
|---|
| | | <button v-if="peifanhao[0]['0_recipe_no']!=null" id="peifangxiafa" @click="peifangxiafa(1)" type="button" class="btn btn-primary btn-lg" |
|---|
| | | id="peifangxiafa">é
æ¹ä¸å</button> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </section> |
|---|
| | | <!-- /.content --> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | data:{ |
|---|
| | | shuzu:[], |
|---|
| | | shuzu1:[], |
|---|
| | | shuzu2:[], |
|---|
| | | lines:<%= request.getParameter("id") %>, |
|---|
| | | peifanhao:[], |
|---|
| | | peifanhao:[{}], |
|---|
| | | subval:{ |
|---|
| | | id:'', |
|---|
| | | type:'' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | dainjishijian:function(type,id){ |
|---|
| | | console.log(type,id); |
|---|
| | | dangqianpeifang(){ |
|---|
| | | |
|---|
| | | this.shuzu2=""; |
|---|
| | | let sql="{call AXJ_a_get_machine_recipe_select()}"; |
|---|
| | | let flag=2; |
|---|
| | | this.loadAjxss('ä»»å¡æ¥è¯¢æå',sql,flag,"shuzu2"); |
|---|
| | | let sql1="{call AXJ_qiegeguanli_peifanghao_cahxun1()}"; |
|---|
| | | this.loadAjxss('é
æ¹å·æ¥è¯¢',sql1,2,"peifanhao") |
|---|
| | | |
|---|
| | | $("#modify-infos").modal('show'); |
|---|
| | | }, |
|---|
| | | dainjishijian(type,id){ |
|---|
| | | $("#modify-info").modal('show'); |
|---|
| | | if(type=="é¢åä»»å¡"){ |
|---|
| | | this.subval.type=2; |
|---|
| | |
|---|
| | | this.subval.type=1; |
|---|
| | | } |
|---|
| | | this.subval.id=id |
|---|
| | | let para={ |
|---|
| | | ids:id |
|---|
| | | } |
|---|
| | | let sql="{call AXJ_qiegeguanli_peifanghao_cahxun(?,?)}~"+JSON.stringify(para); |
|---|
| | | this.loadAjxss('é
æ¹å·æ¥è¯¢',sql,2,"peifanhao") |
|---|
| | | }, |
|---|
| | | getMSg(){ |
|---|
| | | //this.getMSgs(); |
|---|
| | | |
|---|
| | | this.renwuguanli(); |
|---|
| | | }, |
|---|
| | | getMSgs(){ |
|---|
| | |
|---|
| | | param.append("flag",1); |
|---|
| | | param.append("anquanma",json["anquanma"]); |
|---|
| | | |
|---|
| | | this.$http.post('../mysqlInsert/mysql.jsp',param).then(({ data }) => { |
|---|
| | | let result=$(data).text(); |
|---|
| | | this.$http.post('../mysqlInsert/mysql.jsp',param).then(( datas ) => { |
|---|
| | | let result=datas.data; |
|---|
| | | index = result.indexOf("[["); |
|---|
| | | if(index>-1){ |
|---|
| | | if(result.indexOf("[[anquanmaerr]]")>-1){ |
|---|
| | |
|---|
| | | } |
|---|
| | | }else{ |
|---|
| | | alert("ä»»å¡ä¿®æ¹æåï¼") |
|---|
| | | resolve(); |
|---|
| | | window.location.reload(); |
|---|
| | | |
|---|
| | | } |
|---|
| | |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("zt",this.subval.type); |
|---|
| | | param.append("peifanhao",this.peifanhao[0]['0_recipe_no']); |
|---|
| | | param.append("changpinghao",this.peifanhao[0]['1_changpinghao']); |
|---|
| | | param.append("way_of_working",this.peifanhao[0]['2_way_of_working']); |
|---|
| | | param.append("thickness",this.peifanhao[0]['3_thickness']); |
|---|
| | | param.append("glass_type",this.peifanhao[0]['4_glass_type']); |
|---|
| | | param.append("production_type",this.peifanhao[0]['5_production_type']); |
|---|
| | | this.$http.post( '../mysqlInsert/toPlc.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | console.log(response); |
|---|
| | |
|---|
| | | alert('Error: ' + "æå¡å¨æºå¨è¿æ¥åçé误ï¼"); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | peifangxiafa(leixing){ |
|---|
| | | if(leixing=1){ |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("zt",98); |
|---|
| | | param.append("peifanhao",this.peifanhao[0]['0_recipe_no']); |
|---|
| | | this.$http.post( '../mysqlInsert/toPlc.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | console.log(response); |
|---|
| | | }) |
|---|
| | | |
|---|
| | | .catch(function (error) { |
|---|
| | | alert('Error: ' + "æå¡å¨æºå¨è¿æ¥åçé误ï¼"); |
|---|
| | | }); |
|---|
| | | }else if(leixing=2){ |
|---|
| | | let param = new URLSearchParams(); |
|---|
| | | param.append("zt",99); |
|---|
| | | param.append("peifanhao",this.peifanhao[0]['0_recipe_no']); |
|---|
| | | param.append("changpinghao",this.peifanhao[0]['1_changpinghao']); |
|---|
| | | param.append("way_of_working",this.peifanhao[0]['2_way_of_working']); |
|---|
| | | param.append("thickness",this.peifanhao[0]['3_thickness']); |
|---|
| | | param.append("glass_type",this.peifanhao[0]['4_glass_type']); |
|---|
| | | param.append("production_type",this.peifanhao[0]['5_production_type']); |
|---|
| | | this.$http.post( '../mysqlInsert/toPlc.jsp',param) |
|---|
| | | .then(function (response) { |
|---|
| | | console.log(response); |
|---|
| | | }) |
|---|
| | | |
|---|
| | | .catch(function (error) { |
|---|
| | | alert('Error: ' + "æå¡å¨æºå¨è¿æ¥åçé误ï¼"); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | renwuguanliquxiao:function(){ |
|---|
| | | this.subval=''; |
|---|
| | |
|---|
| | | this.shuzu=""; |
|---|
| | | let sql="{call AXJ_qiegeguanli_threelinetask_list1()}"; |
|---|
| | | let flag=2; |
|---|
| | | loadAjxs('ä»»å¡æ¥è¯¢æå',sql,flag,"shuzu"); |
|---|
| | | sql="{call AXJ_qiegeguanli_peifanghao_cahxun()}"; |
|---|
| | | loadAjxs('é
æ¹å·æ¥è¯¢',sql,flag,"peifanhao"); |
|---|
| | | this.loadAjxss('ä»»å¡æ¥è¯¢æå',sql,flag,"shuzu"); |
|---|
| | | /* sql="{call AXJ_qiegeguanli_peifanghao_cahxun()}"; |
|---|
| | | loadAjxs('é
æ¹å·æ¥è¯¢',sql,flag,"peifanhao"); */ |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | |
|---|
| | | </button> |
|---|
| | | <ul class="dropdown-menu" style="height: 320px; overflow: auto;"> |
|---|
| | | <li v-for='items in shelfRack' style="font-size: 20px"> |
|---|
| | | <a href="#" onclick="$('#shelfRankInput').val($(this).text())">{{items[0]}}</a> |
|---|
| | | <a href="#" onclick="$('#shelfRankInput').val($(this).text())">{{items['0_number']}}</a> |
|---|
| | | </li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | </button> |
|---|
| | | <ul class="dropdown-menu" style="height: 280px; overflow: auto;background-color:bule"> |
|---|
| | | <li v-for='color in colors' style="font-size: 20px;background-color:bule"><a href="#" |
|---|
| | | onclick="$('#colors').val($(this).text())">{{color[0]}}</a></li> |
|---|
| | | onclick="$('#colors').val($(this).text())">{{color['0_glass_id']}}</a></li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | <script type="text/javascript" src="../static/bootstrap/3.3.7/js/bootstrap.min.js"></script> |
|---|
| | | <script src="../js/vue.min.js"></script> |
|---|
| | | <script src="../js/axios.min.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <script src="../js/vue.min.js"></script> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | Vue.prototype.$http= axios |
|---|
| | | let app = new Vue({ |
|---|
| | | el:'#app', |
|---|
| | | mixins:[mixin], |
|---|
| | | data:{ |
|---|
| | | shuzu:[], |
|---|
| | | shuzu1:[], |
|---|
| | | shelfRack:<%= DBHelper.getDBHelper("mes").query(false,"SELECT number from storage_rack where state='使ç¨ä¸' and falg='å¯ç¨';") %>, |
|---|
| | | colors:<%= DBHelper.getDBHelper("mes").query(false,"SELECT glass_id from glass_number_color ") %>, |
|---|
| | | shelfRack:[{}], |
|---|
| | | colors:[{}], |
|---|
| | | updateGlassId:"", |
|---|
| | | pieces:"", |
|---|
| | | clearGlassMsg:{ |
|---|
| | |
|---|
| | | this.shuzu1=""; |
|---|
| | | let sql="{call AXJ_qiegeguanli_shangpianwei_chaxun()}"; |
|---|
| | | let flag=2; |
|---|
| | | loadAjxs('ä»å¨ä»»å¡ä¸é¢æ¥è¯¢',sql,flag,"shuzu"); |
|---|
| | | this.loadAjxss('ä»å¨ä»»å¡ä¸é¢æ¥è¯¢',sql,flag,"shuzu"); |
|---|
| | | let sql1="{call AXJ_qiegeguanli_shangpianwei_chaxun1()}"; |
|---|
| | | |
|---|
| | | loadAjxs('ä»å¨ä»»å¡ä¸é¢æ¥è¯¢',sql1,flag,"shuzu1"); |
|---|
| | | this.loadAjxss('ä»å¨ä»»å¡ä¸é¢æ¥è¯¢',sql1,flag,"shuzu1"); |
|---|
| | | sql="{call AXJ_liaojiaguanli_colors(?)}"; |
|---|
| | | this.loadAjxss('ä¸çä½é¢è²æ¥è¯¢',sql,flag,"colors"); |
|---|
| | | sql="{call AXJ_liaojiaguanli_shelfrack_shangpianwei()}"; |
|---|
| | | this.loadAjxss('ä¸çä½æ¶åæ¥è¯¢',sql,flag,"shelfRack"); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | |
|---|
| | | <!-- jQuery 3 --> |
|---|
| | | <script src="../js/jquery-3.4.1.min.js"></script> |
|---|
| | | <!-- Bootstrap 3.3.7 --> |
|---|
| | | <script |
|---|
| | | src="../static/AdminLTE/bower_components/bootstrap/dist/js/bootstrap.min.js"></script> |
|---|
| | | |
|---|
| | | <!-- DataTables --> |
|---|
| | | <!-- SlimScroll --> |
|---|
| | | <!-- FastClick --> |
|---|
| | |
|---|
| | | <div class="box box-default" style="background-color:#D5EAFF;"> |
|---|
| | | <div class="box-header with-border"> |
|---|
| | | <h3 class="box-title">ä»å¨</h3> |
|---|
| | | <span :class="connect[0]['1_classname']">{{connect[0]['0_connect_state']}}</span> |
|---|
| | | <span :class="classname">{{connect[0]['0_connect_state']}}</span> |
|---|
| | | </div> |
|---|
| | | <!-- /.box-header --> |
|---|
| | | <button type="button" @click="delAll('éæ°å¼å§')" class="btn btn-primary ">éæ°å¼å§</button> |
|---|
| | |
|---|
| | | </thead> |
|---|
| | | <tbody> |
|---|
| | | <tr v-for="items in shuzu"> |
|---|
| | | <td><input v-model="shelftaskids" type='checkbox' :value="items[0]"/></td> |
|---|
| | | <td><input v-model="shelftaskids" type='checkbox' :value="items['0_id']"/></td> |
|---|
| | | <td>{{items['0_id']}}</td> |
|---|
| | | <td>{{items['1_task_type']}}</td> |
|---|
| | | <td>{{items['2_task_state']}}</td> |
|---|
| | |
|---|
| | | <!-- /.content-wrapper --> |
|---|
| | | <!-- page script --> |
|---|
| | | |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | <script |
|---|
| | | src="../static/AdminLTE/bower_components/bootstrap/dist/js/bootstrap.min.js"></script> |
|---|
| | | |
|---|
| | | <script src="../js/vue.min.js"></script> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <script> |
|---|
| | | let app = new Vue({ |
|---|
| | | el:'#app', |
|---|
| | |
|---|
| | | data:{ |
|---|
| | | shuzu:[], |
|---|
| | | connect:"", |
|---|
| | | shelftaskids:[] |
|---|
| | | shelftaskids:[], |
|---|
| | | classname:'' |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | delAll:function(types){ |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted:function(){ |
|---|
| | | watch:{ |
|---|
| | | shuzu(newVal){ |
|---|
| | | for(let i=0;i<newVal.length;i++){ |
|---|
| | | switch (newVal[i]['1_task_type']) { |
|---|
| | | case "ä»ä»ä½å°ä¸çä½": |
|---|
| | | newVal[i]['1_task_type']="ä»ã"+newVal[i]['3_shelf_rack']+"ãä»ä½å°ã"+newVal[i]['4_load_rack']+"ãä¸çä½"; |
|---|
| | | break; |
|---|
| | | case "ä»ä¸çä½å°ä»ä½": |
|---|
| | | newVal[i]['1_task_type']="ä»ã"+newVal[i]['4_load_rack']+"ãä¸çä½å°ã"+newVal[i]['3_shelf_rack']+"ãä»ä½"; |
|---|
| | | break; |
|---|
| | | |
|---|
| | | case "ä»ä»ä½å°åè£
ä½": |
|---|
| | | newVal[i]['1_task_type']="ä»ã"+newVal[i]['3_shelf_rack']+"ãä»ä½å°ã"+newVal[i]['4_load_rack']+"ãåè£
ä½"; |
|---|
| | | break; |
|---|
| | | case "ä»åè£
ä½å°ä»ä½": |
|---|
| | | newVal[i]['1_task_type']="ä»ã"+newVal[i]['4_load_rack']+"ãåè£
ä½å°ã"+newVal[i]['3_shelf_rack']+"ãä»ä½"; |
|---|
| | | break; |
|---|
| | | |
|---|
| | | default: |
|---|
| | | break; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async mounted(){ |
|---|
| | | let sql="{call AXJ_liaojiaguanli_cangchurenwuxiangxi(?)}"; |
|---|
| | | let flag=2; |
|---|
| | | loadAjxs('ä»å¨ä»»å¡ä¸é¢æ¥è¯¢',sql,flag,"shuzu"); |
|---|
| | | this.loadAjxss('ä»å¨ä»»å¡ä¸é¢æ¥è¯¢',sql,flag,"shuzu"); |
|---|
| | | sql="{call AXJ_liaojiaguanli_cangchurenwu_lianjie(?)}"; |
|---|
| | | loadAjxs('ä»å¨ä»»å¡è¿æ¥',sql,flag,"connect"); |
|---|
| | | await this.loadAjxss('ä»å¨ä»»å¡è¿æ¥',sql,flag,"connect"); |
|---|
| | | this.classname=this.connect[0]['1_classname'] |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | |
|---|
| | | <script type="text/javascript" src="../static/js/sucaijiayuan.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/laydate/laydate.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/util/utilAlert.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/bootstrap/3.3.7/js/bootstrap.min.js"></script> |
|---|
| | | |
|---|
| | | <style type="text/css"> |
|---|
| | | .rank { |
|---|
| | | font-weight: bolder; |
|---|
| | |
|---|
| | | |
|---|
| | | <script type="text/javascript"> |
|---|
| | | |
|---|
| | | /* var interval = setInterval('refreshStatus()', 20000); */ |
|---|
| | | //let interval = setInterval('refreshStatus()', 20000); |
|---|
| | | //设å¤é¡µé¢èªå¨å·æ° |
|---|
| | | /* function refreshStatus() { |
|---|
| | | window.location.reload(); |
|---|
| | | } */ |
|---|
| | | } |
|---|
| | | //åæ¢é¡µé¢èªå¨å·æ° |
|---|
| | | function disableAutoRefresh() { |
|---|
| | | clearInterval(interval); |
|---|
| | |
|---|
| | | <div v-show="item['9_rukutime']*1>7" :style="{height:item['10_bfb']}" class='progress-bar progress-bar-danger progress-bar-striped progress-bar-red'> |
|---|
| | | <span>{{item['5_left_pieces']}}/{{item['8_pieces']}}</span> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div>{{item['0_number']}}</div> |
|---|
| | | </td> |
|---|
| | |
|---|
| | | <table id="example" class="table table-bordered table-condensed" style="font-size: 12px;"> |
|---|
| | | <thead style="font-size: 20px; Height: 40px"> |
|---|
| | | <tr> |
|---|
| | | <th><input type="checkbox" name="allChecked" /></th> |
|---|
| | | <th><input type="checkbox" v-model="checkFlag" name="allChecked" @click="quanxuan" /></th> |
|---|
| | | <th style="display:none">ç¼å·</th> |
|---|
| | | <th>åºä½å·</th> |
|---|
| | | <th>ç±»å</th> |
|---|
| | |
|---|
| | | </section> |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | <script src="../js/mixins.js"></script> |
|---|
| | | <script src="../js/vue.min.js"></script> |
|---|
| | | |
|---|
| | | <script src="../js/main.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/bootstrap/3.3.7/js/bootstrap.min.js"></script> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | let app = new Vue({ |
|---|
| | | mixins:[mixin], |
|---|
| | |
|---|
| | | shuzu:[], |
|---|
| | | shelfRack:[], |
|---|
| | | colors:[], |
|---|
| | | checkFlag:false |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | start:function(func){ |
|---|
| | |
|---|
| | | } |
|---|
| | | //è·åéæ©çåè£
ä½ |
|---|
| | | this.glass.dzw=$("#dzw").val(); |
|---|
| | | alert(JSON.stringify(this.glass)); |
|---|
| | | let sql="{call AXJ_liaojiaguanli_ruku(?,?,?,?,?,?,?,?,?,?)}~"+JSON.stringify(this.glass); |
|---|
| | | //console.log(sql); |
|---|
| | | $("#myModal-add-info").modal('hide'); |
|---|
| | |
|---|
| | | this.load_rack=$("#dzw").val(); |
|---|
| | | let sql="{call AXJ_liaojiaguanli_diaozhuangweiruku(?,?)}~"+"{'load_rack':'"+this.load_rack+"'}"; |
|---|
| | | this.connects("åè£
ä½å
¥åº",sql,1,1); |
|---|
| | | }, |
|---|
| | | quanxuan(){ |
|---|
| | | this.checkFlag=!this.checkFlag; |
|---|
| | | this.shelfId=[]; |
|---|
| | | if(this.checkFlag){ |
|---|
| | | for(let item in this.shuzu){ |
|---|
| | | this.shelfId.push(this.shuzu[item]["0_number"]); |
|---|
| | | } |
|---|
| | | }else{ |
|---|
| | | this.shelfId=[]; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | mounted:function(){ |
|---|
| | | let sql="{call AXJ_liaojiaguanli_kucunchaxun(?)}"; |
|---|
| | | let flag=2; |
|---|
| | | loadAjxs('åçä»å¨ç»çæ¥è¯¢',sql,flag,"shuzu"); |
|---|
| | | this.loadAjxss('åçä»å¨ç»çæ¥è¯¢',sql,flag,"shuzu"); |
|---|
| | | sql="{call AXJ_liaojiaguanli_shelfrack(?)}"; |
|---|
| | | loadAjxs('åçä»å¨æ¶åæ¥è¯¢',sql,flag,"shelfRack"); |
|---|
| | | this.loadAjxss('åçä»å¨æ¶åæ¥è¯¢',sql,flag,"shelfRack"); |
|---|
| | | sql="{call AXJ_liaojiaguanli_colors(?)}"; |
|---|
| | | loadAjxs('åçä»å¨é¢è²æ¥è¯¢',sql,flag,"colors"); |
|---|
| | | this.loadAjxss('åçä»å¨é¢è²æ¥è¯¢',sql,flag,"colors"); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
