维修表单

src/main/resources/static/css/account/login.css

@@ -11,16 +11,9 @@ footer .footTop{display:none;}
 .loginForm h1{color:#22272e;font-size:24px;font-weight:bold;line-height:30px}
 .loginForm h2{color:#22272e;font-size:16px;font-weight:normal;line-height:24px}
 .loginForm form{margin-top:60px}
-.loginForm input{box-sizing:border-box;display:block;width:100%;height:48px;line-height:48px;background-color:#ffffff;border-radius:2px;border:solid 1px #b8bfca;text-indent:1.2em;font-size:14px}
-.loginForm .error input{border-color:#f94b4b}
-.loginForm input:focus{border-color:#ffe6dc;}
-.loginForm .formLine{height:70px;width:100%;position:relative}
-.loginForm .checked{position:absolute;width:20px;height:20px;top:14px;right:5px;display:none}
-.loginForm .checked:before{width:20px;height:20px;background-position:-138px -296px}
-.loginForm .errTips{display:block;height:20px;line-height:20px;white-space:nowrap;color:red;font-size:12px;visibility:hidden}
-.loginForm .checked.show{display:block}
-.loginForm .errTips.show{visibility:visible}
-.loginForm .errTips:before{width:20px;height:20px;background-position:-172px -296px;vertical-align:top}
+.loginForm .formLine{height:70px;padding:0;}
+.loginForm input{height:48px;line-height:48px;}
+.loginForm .checked{top:14px;}
 .loginForm .forget{text-align:right;color:#4a4f58;font-size:14px;line-height:14px;margin-top:-10px}
 .loginForm .submit{height:44px;line-height:0;font-size:0;text-align:justify;margin-top:20px}
 .loginForm .submit:after{content:'';display:inline-block;width:100%}
@@ -52,16 +45,9 @@ footer{display:none}
 .loginForm h1{color:#22272e;font-size:6.4vw;font-weight:bold;line-height:10vw}
 .loginForm h2{font-size:3.1vw;font-weight:normal;line-height:5.4vw;color:#627386}
 .loginForm form{width:93.4vw;margin:54vw auto 0}
-.loginForm input{box-sizing:border-box;display:block;width:100%;height:11.6vw;line-height:11.6vw;background-color:#ffffff;border-radius:2px;border:solid 1px #b8bfca;text-indent:1.2em;font-size:3.4vw;text-align:left}
-.loginForm .error input{border-color:#f94b4b}
-.loginForm input:focus{border-color:#ffe6dc;}
-.loginForm .formLine{height:16.4vw;width:100%;position:relative}
-.loginForm .checked{position:absolute;width:4.4vw;height:4.4vw;top:3.6vw;right:3.6vw;display:none}
-.loginForm .checked:before{width:4.4vw;height:4.4vw;background-position:22.5% 32.1%}
-.loginForm .errTips{display:block;height:4.4vw;line-height:4.4vw;white-space:nowrap;color:red;font-size:3vw;text-align:left;visibility:hidden}
-.loginForm .checked.show{display:block}
-.loginForm .errTips.show{visibility:visible}
-.loginForm .errTips:before{width:4.4vw;height:4.4vw;background-position:33% 32.1%;vertical-align:top}
+.loginForm .formLine{height:16.4vw;padding:0;}
+.loginForm input{height:11.6vw;line-height:11.6vw;}
+.loginForm .checked{top:3.6vw;right:3.6vw;}
 .loginForm .forget{text-align:right;color:#4a4f58;font-size:3.4vw;line-height:3.4vw;margin-bottom:4.8vw}
 .loginForm .submit .btn{display:inline-block;box-sizing:border-box;width:100%;height:11.2vw;line-height:11.2vw;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;text-align:center;color:#e15616;font-size:3.4vw;margin-bottom:4.8vw}
 .loginForm .submit button.btn{background-color:#e15616;color:#FFF;margin-bottom:4.8vw}

src/main/resources/static/css/account/register.css

@@ -22,29 +22,6 @@ footer .footTop{display:none;}
 .advisoryInfo .info{margin-bottom:15px;color:#1890f9;font-size:14px}
 .advisoryInfo .btn{display:block;width:232px;height:50px;line-height:50px;margin:0 auto;font-size:18px;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;color:#e15616}
 .signAccount .advisory:hover .advisoryInfo{display:block;transition:all .5s}
-
-.formLine{padding-bottom:4px;font-size:14px;position:relative}
-.formLine input,.formLine select{box-sizing:border-box;width:100%;height:36px;line-height:34px;text-indent:1.2em;background-color:#FFF;border:1px solid #b8bfca;border-radius:2px}
-.formLine p{height:32px;line-height:32px}
-.formLine p em{font-style:normal;color:#f94b4b;margin:0 5px}
-.formLine p span{color:#ffb496;}
-.formLine .checked{position:absolute;width:20px;height:20px;top:40px;right:5px;display:none}
-.formLine .checked:before{width:20px;height:20px;background-position:-138px -296px}
-.formLine .errTips{display:block;height:20px;line-height:20px;white-space:nowrap;color:red;font-size:12px;visibility:hidden}
-.formLine .checked.show{display:block}
-.formLine .errTips.show{visibility:visible}
-.formLine .errTips:before{width:20px;height:20px;background-position:-172px -296px;vertical-align:top}
-.formLine .showPwd{position:absolute;right:22px;top:42px;width:22px;height:16px;cursor:pointer}
-.formLine .showPwd:before{width:22px;height:20px;background-position:-240px -299px}
-.formLine .showPwd.on:before{width:22px;height:20px;background-position:-205px -299px}
-.formLine.code input{width:312px}
-.formLine.code .checked{right:auto;left:288px}
-.formLine.code .getCode{position:absolute;right:0;top:32px;box-sizing:border-box;width:168px;height:36px;line-height:34px;text-align:center;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;color:#e15616;font-size:14px}
-.subLine{font-size:14px}
-.subLine input{vertical-align:top;margin-right:10px;cursor:pointer}
-.subLine a{color:#1890f9}
-.subLine a:hover{color:#e15616}
-.subLine .btn{display:block;margin:32px auto;width:232px;height:50px;line-height:50px;background-color:#e15616;border-radius:2px;text-align:center;font-size:18px;color:#FFF}
 .supplierConfirm .cont{width:880px;height:550px;box-sizing:border-box;background:#fff;padding:46px;border-radius:4px;color:#333;font-size:16px;box-shadow:0 10px 20px 0 rgba(0,0,0,0.16)}
 .supplierConfirm .cont h3{text-align:center;font-size:24px}
 .supplierConfirm .cont p:first-of-type{color:#E36125;margin-top:30px}
@@ -55,16 +32,6 @@ footer .footTop{display:none;}
 .supplierConfirm .btnLine input{margin-right:10px;vertical-align:text-top;margin-top:3px}
 .supplierConfirm .btnLine button{width:340px;height:50px;background:#E15616;color:#fff;margin-top:20px;cursor:pointer}
 .registerShop .tit{color:#22272e;font-size:24px;font-weight:normal;margin:20px 0}
-.formLine .address{text-align:justify;line-height:0}
-.formLine .address select{display:inline-block;width:154px}
-.formLine .address textarea{display:inline-block;width:100%;height:114px;box-sizing:border-box;border:solid 1px #b8bfca;padding:10px 16px;line-height:20px;margin-top:16px}
-.formLine .diyBox{width:180px;height:36px;margin-right: 10px;line-height:34px;box-sizing:border-box;text-align:center;display:inline-block}
-.formLine .diyBox.second{width:100px;}
-.formLine .diyBox input{display:none}
-.formLine .diyBox i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:1px solid #b8bfca;color:#627386;font-size:14px}
-.formLine .diyBox i:before{position:absolute;right:0;bottom:0;display:none;width:20px;height:20px;background-position:-208px -253px}
-.formLine .diyBox input:checked + i{border-color:#e15616;color:#e15616}
-.formLine .diyBox input:checked + i:before{display:block}
 .formLine .business{height:auto;position:relative}
 .formLine .business input[type="text"]{width:388px;display:block}
 .formLine .business a{position:absolute;right:0;bottom:0;width:92px;height:34px;line-height:34px;font-size:14px;color:#e15616;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;text-align:center}
@@ -88,28 +55,6 @@ footer{display:none}
 .signAccount .title{height:6vw;line-height:6vw;font-weight:bold;font-size:4.2vw;color:#22272e;text-align:center;padding:5.2vw 0}
 .registerShop .tit{color:#22272e;font-size:3.7vw;font-weight:normal;margin:3vw 0}
 .signAccount form{width:93.4vw;margin:0 auto;}
-
-.formLine{width:100%;position:relative;}
-.formLine .checked{position:absolute;width:4.4vw;height:4.4vw;top:13.6vw;right:3.6vw;display:none}
-.formLine .checked:before{width:4.4vw;height:4.4vw;background-position:22.5% 32.1%}
-.formLine .errTips{display:block;height:4.4vw;line-height:4.4vw;white-space:nowrap;color:red;font-size:3vw;text-align:left;visibility:hidden}
-.formLine .checked.show{display:block}
-.formLine .errTips.show{visibility:visible}
-.formLine .errTips:before{width:4.4vw;height:4.4vw;background-position:33% 32.1%;vertical-align:top}
-.formLine .showPwd{display:none;}
-.formLine input,.formLine select{box-sizing:border-box;width:100%;height:11.2vw;line-height:11.2vw;text-indent:1.2em;font-size:3.4vw;text-align:left;background-color:#ffffff;border-radius:2px;border:solid 1px #b8bfca;}
-.formLine .error input{border-color:#f94b4b}
-.formLine input:focus{border-color:#ffe6dc;}
-.formLine p{line-height:10.2vw}
-.formLine p em{font-style:normal;color:#f94b4b;margin:0 1vw}
-.formLine p span{color:#ffb496;}
-.formLine.code input{width:57.4vw}
-.formLine.code .checked{right:auto;left:50vw;}
-.formLine.code .getCode{position:absolute;right:0;top:10vw;box-sizing:border-box;width:33.4vw;height:11.2vw;line-height:11.2vw;text-align:center;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;color:#e15616;}
-.subLine{text-align:center;font-size:3.1vw;padding-top:5vw;}
-.subLine input{margin-right:1vw;}
-.subLine a{color:#1890f9}
-.subLine .btn{display:block;margin:5vw auto;width:100%;height:11.2vw;line-height:11.2vw;background-color:#e15616;border-radius:2px;text-align:center;font-size:18px;color:#FFF}
 .supplierConfirm .cont{width:100%;min-height:90vw;box-sizing:border-box;padding:3.3vw;color:#333;font-size:3.4vw;}
 .supplierConfirm .cont h3{height:6vw;line-height:6vw;font-weight:bold;font-size:4.2vw;color:#22272e;text-align:center;}
 .supplierConfirm .cont p:first-of-type{color:#E36125;margin-top:3vw}
@@ -119,21 +64,9 @@ footer{display:none}
 .supplierConfirm .btnLine p{color:#000;}
 .supplierConfirm .btnLine input{margin-right:1vw;}
 .supplierConfirm .btnLine button{display:block;font-size:3.4vw;margin:5vw auto;width:93.4vw;height:11.2vw;line-height:11.2vw;background:#E15616;color:#fff;}
-
-.formLine .address{text-align:justify;line-height:0}
-.formLine .address select{display:inline-block;width:29.5vw}
-.formLine .address textarea{display:inline-block;width:100%;height:42.4vw;box-sizing:border-box;border:solid 1px #b8bfca;padding:3vw;line-height:5vw;margin-top:2.7vw;}
-.formLine .diyBox{width:34vw;height:11.2vw;line-height:11.2vw;margin-right: 1.5vw;box-sizing:border-box;text-align:center;display:inline-block}
-.formLine .diyBox.second{width:20vw;}
-.formLine .diyBox input{display:none}
-.formLine .diyBox i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:1px solid #b8bfca;color:#627386;}
-.formLine .diyBox i:before{position:absolute;right:0;bottom:0;display:none;width:6vw;height:6vw;background-position: 38% 18.5%;}
-.formLine .diyBox input:checked + i{border-color:#e15616;color:#e15616}
-.formLine .diyBox input:checked + i:before{display:block}
 .formLine .business {position: relative;}
 .formLine .business input[type="text"]{width:69.4vw;display:block}
 .formLine .business a{position:absolute;right:0;bottom:0;width:21.4vw;height:11.2vw;line-height:11.2vw;color:#e15616;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;text-align:center}
-
 /*.advisory{display: none;}*/
 .advisoryInfo{box-sizing:border-box;width:74.7vw;background:#fff;box-shadow:0 10px 20px 0 rgba(0,0,0,0.16);padding:6.2vw;border-radius:1vw}
 .advisoryInfo form{width:100%}

src/main/resources/static/css/base/base.pc.css

@@ -3,6 +3,7 @@
 * PC端
 */
 body{min-width:1184px;}
+header{box-shadow: 0 2px 10px #ebecef;}
 .h5Only{display:none!important;}
 /*定义滚动条样式*/
 ::-webkit-scrollbar{width:10px;height:10px;background-color:#F6F6F6}

src/main/resources/static/css/base/form.css

@@ -0,0 +1,81 @@
+@charset "utf-8";
+/**
+ * PC端
+ */
+ .formLine .diyBox i{display:block;font-style:normal;cursor:pointer;width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px;background:#FFF;border:1px solid #b8bfca;color:#627386;}
+@media screen and (min-width:768px){
+.formLine{padding-bottom:4px;font-size:14px;position:relative}
+.formLine input,.formLine select{box-sizing:border-box;width:100%;height:36px;line-height:34px;text-indent:1.2em;background-color:#FFF;border:1px solid #b8bfca;border-radius:2px}
+.formLine textarea{width:100%;height:114px;box-sizing:border-box;border:solid 1px #b8bfca;padding:10px 16px;line-height:20px;}
+.formLine select{width:154px}
+.formLine.error input{border-color:#f94b4b}
+.formLine input:focus{border-color:#ffe6dc;}
+.formLine p{height:32px;line-height:32px}
+.formLine p em{font-style:normal;color:#f94b4b;margin:0 5px}
+.formLine p span{color:#ffb496;}
+.formLine .checked{position:absolute;width:20px;height:20px;top:40px;right:5px;display:none}
+.formLine .checked:before{width:20px;height:20px;background-position:-138px -296px}
+.formLine .errTips{display:block;height:20px;line-height:20px;white-space:nowrap;color:red;font-size:12px;visibility:hidden}
+.formLine .checked.show{display:block}
+.formLine .errTips.show{visibility:visible}
+.formLine .errTips:before{width:20px;height:20px;background-position:-172px -296px;vertical-align:top}
+.formLine .showPwd{position:absolute;right:22px;top:42px;width:22px;height:16px;cursor:pointer}
+.formLine .showPwd:before{width:22px;height:20px;background-position:-240px -299px}
+.formLine .showPwd.on:before{width:22px;height:20px;background-position:-205px -299px}
+.formLine.code input{width:312px}
+.formLine.code .checked{right:auto;left:288px}
+.formLine.code .getCode{position:absolute;right:0;top:32px;box-sizing:border-box;width:168px;height:36px;line-height:34px;text-align:center;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;color:#e15616;font-size:14px}
+
+.subLine p{font-size:14px}
+.subLine p input{vertical-align:top;margin-right:10px;cursor:pointer}
+.subLine p a{color:#1890f9}
+.subLine p a:hover{color:#e15616}
+.subLine .btn{display:block;margin:32px auto;width:232px;height:50px;line-height:50px;background-color:#e15616;border-radius:2px;text-align:center;font-size:18px;color:#FFF}
+
+.formLine .address{text-align:justify;line-height:0}
+.formLine .address textarea{margin-top:16px}
+.formLine .diyBox{width:180px;height:36px;margin-right:10px;line-height:34px;box-sizing:border-box;font-size:14px;text-align:center;display:inline-block}
+.formLine .diyBox.second{width:100px;}
+.formLine .diyBox input{display:none}
+.formLine .diyBox i:before{position:absolute;right:0;bottom:0;display:none;width:20px;height:20px;background-position:-208px -253px}
+.formLine .diyBox input:checked + i{border-color:#e15616;color:#e15616}
+.formLine .diyBox input:checked + i:before{display:block}
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+.formLine{width:100%;position:relative;font-size:3.4vw;}
+.formLine input,.formLine select{box-sizing:border-box;width:100%;height:11.2vw;line-height:11.2vw;text-indent:1.2em;font-size:3.4vw;text-align:left;background-color:#ffffff;border-radius:2px;border:solid 1px #b8bfca;}
+.formLine textarea{display:inline-block;width:100%;height:42.4vw;box-sizing:border-box;border:solid 1px #b8bfca;padding:3vw;line-height:5vw;margin-top:2.7vw;}
+.formLine select {width: 29.5vw;}
+.formLine.error input{border-color:#f94b4b}
+.formLine input:focus{border-color:#ffe6dc;}
+.formLine p{line-height:10.2vw}
+.formLine p em{font-style:normal;color:#f94b4b;margin:0 1vw}
+.formLine p span{color:#ffb496;}
+.formLine .checked{position:absolute;width:4.4vw;height:4.4vw;top:13.6vw;right:3.6vw;display:none}
+.formLine .checked:before{width:4.4vw;height:4.4vw;background-position:22.5% 32.1%}
+.formLine .errTips{display:block;height:4.4vw;line-height:4.4vw;white-space:nowrap;color:red;font-size:3vw;text-align:left;visibility:hidden}
+.formLine .checked.show{display:block}
+.formLine .errTips.show{visibility:visible}
+.formLine .errTips:before{width:4.4vw;height:4.4vw;background-position:33% 32.1%;vertical-align:top}
+.formLine .showPwd{display:none;}
+.formLine.code input{width:57.4vw}
+.formLine.code .checked{right:auto;left:50vw;}
+.formLine.code .getCode{position:absolute;right:0;top:10vw;box-sizing:border-box;width:33.4vw;height:11.2vw;line-height:11.2vw;text-align:center;background-color:#ffe6dc;border-radius:2px;border:solid 1px #e15616;color:#e15616;}
+.subLine{text-align:center;font-size:3.1vw;padding-top:5vw;}
+.subLine p input{margin-right:1vw;}
+.subLine p a{color:#1890f9}
+.subLine .btn{display:block;margin:5vw auto;width:100%;height:11.2vw;line-height:11.2vw;background-color:#e15616;border-radius:2px;text-align:center;font-size:18px;color:#FFF}
+.formLine .address{text-align:justify;line-height:0}
+.formLine .diyBox{width:34vw;height:11.2vw;line-height:11.2vw;margin-right: 1.5vw;box-sizing:border-box;text-align:center;display:inline-block}
+.formLine .diyBox.second{width:20vw;}
+.formLine .diyBox input{display:none}
+.formLine .diyBox i:before{position:absolute;right:0;bottom:0;display:none;width:6vw;height:6vw;background-position: 38% 18.5%;}
+.formLine .diyBox input:checked + i{border-color:#e15616;color:#e15616}
+.formLine .diyBox input:checked + i:before{display:block}
+
+}

src/main/resources/static/css/maintenance/form.css

@@ -1,9 +1,15 @@
 @charset "utf-8";
 li{list-style:none}
+body{background:#FFF;}
 /**
  * PC端
  */
 @media screen and (min-width:768px){
+.maintenance{width:1184px;margin:0 auto;}
+.maintenance .title{height:42px;line-height:42px;font-weight:bold;font-size:32px;color:#22272e;text-align:center;padding:30px}
+.maintenance .desc{font-size:14px;color:#e15616;height:36px;line-height:36px;text-align:center;margin-bottom:30px;background-color:#fff7f3;background-image:-ms-linear-gradient(270deg,#ffffff 0%,#ffe6dc 50%,#ffffff 100%);background-image:-webkit-linear-gradient(270deg,#ffffff 0%,#ffe6dc 50%,#ffffff 100%);background-image:linear-gradient(270deg,#ffffff 0%,#ffe6dc 50%,#ffffff 100%)}
+.maintenance form{width:498px;margin:0 auto}
+.maintenance .fileInfo{font-size:14px;line-height:24px;color:#f94b4b}
 
 
 }
@@ -12,6 +18,13 @@ li{list-style:none}
 * 移动端
 */
 @media screen and (max-width:768px){
+footer{display:none}
+.maintenance{width:93.4vw;margin: 0 auto;}
+.maintenance .title{height:6vw;line-height:6vw;font-weight:bold;font-size:4.2vw;color:#22272e;text-align:center;padding:5.2vw 0}
+.maintenance .desc{font-size:3vw;color:#e15616;line-height:5.2vw;padding:2vw 0;text-align:center;margin-bottom:3vw;background-color:#fff7f3;background-image:-ms-linear-gradient(270deg,#ffffff 0%,#ffe6dc 50%,#ffffff 100%);background-image:-webkit-linear-gradient(270deg,#ffffff 0%,#ffe6dc 50%,#ffffff 100%);background-image:linear-gradient(270deg,#ffffff 0%,#ffe6dc 50%,#ffffff 100%)}
+.maintenance form{width:100%;margin:0 auto}
+.maintenance .fileInfo{font-size:3vw;line-height:5.2vw;color:#f94b4b}
+
 
 
 }

src/main/resources/static/js/account/login.js

@@ -65,21 +65,10 @@ var loginPage = new Vue({
             var el = event.currentTarget;
             verifyHandle(el);
         },
-        // 验证表单
-        verifyForm: function () {
-            var _self = this;
-            $("[needverify]:visible").each(function (index, ele) {
-                if (!$(ele).siblings('.checked').hasClass("show")) {
-                    verifyHandle(ele);
-                }
-            });
-            var len = $('.errTips.show:visible').length;
-            return (len === 0);
-        },
         // 提交登录
         loginSubmit: function () {
             var _self = this;
-            var pass = this.verifyForm();
+            var pass = verifyForm();
             if (this.loginLoading) { return false; }
             this.$nextTick(function(){
                 if (!pass) { return false; }

src/main/resources/static/js/account/register.js

@@ -66,17 +66,6 @@ var registerPage = new Vue({
             var el = event.currentTarget;
             verifyHandle(el);
         },
-        // 验证表单
-        verifyForm: function () {
-            var _self = this;
-            $("[needverify]:visible").each(function (index, ele) {
-                if (!$(ele).siblings('.checked').hasClass("show")) {
-                    verifyHandle(ele);
-                }
-            });
-            var len = $('.errTips.show:visible').length;
-            return (len === 0);
-        },
         /**
          * 机构入驻咨询提交
          */

src/main/resources/static/js/base.js

@@ -418,7 +418,16 @@ function clearErrorTxt(obj) {
     $(obj).siblings('.errTips').removeClass("show");
     $(obj).parent().removeClass("error").find('.checked').addClass("show");
 }
-
+// 提交时验证表单
+function verifyForm() {
+    $("[needverify]:visible").each(function (index, ele) {
+        if (!$(ele).siblings('.checked').hasClass("show")) {
+            verifyHandle(ele);
+        }
+    });
+    var len = $('.errTips.show:visible').length;
+    return (len === 0);
+}
 
 
 // 公共信息提示弹框

src/main/resources/static/js/maintenance/form.js

@@ -1,13 +1,34 @@
 var maintenanceForm = new Vue({
-    el: "#maintenanceForm",
+    el: '#maintenanceForm',
     data: {
-
+        postData: {
+            question: '',
+            linkman: '',
+            phone: '',
+            address: '',
+            name: '',
+            shopName: '',
+            image: ''
+        },
+        rule:{
+            name: '^[a-zA-Z\\u4e00-\\u9fa5]{2,}$',
+            phone: '^\\d{6,12}$'
+        }
     },
     computed: {
 
     },
     methods: {
-
+        // 失去焦点校验
+        blurHandle: function(event) {
+            var el = event.currentTarget;
+            verifyHandle(el);
+        },
+        // 提交数据
+        submitData: function(){
+            alertInfo('提交数据');
+            console.log(JSON.stringify(this.postData));
+        }
     },
     created: function () {
 

src/main/resources/templates/account/login.html

@@ -4,6 +4,7 @@
 <head>
     <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
     <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/base/form.css(v=${version})}" rel="stylesheet" type="text/css">
     <link th:href="@{/css/account/login.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body>

src/main/resources/templates/account/register.html

@@ -4,6 +4,7 @@
 <head>
     <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
     <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/base/form.css(v=${version})}" rel="stylesheet" type="text/css">
     <link th:href="@{/css/account/register.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body>
@@ -80,7 +81,7 @@
                         <i class="icon showPwd" @click="showPassword($event)"></i>
                     </div>
                     <div class="subLine">
-                        <input type="checkbox">我已阅读并同意<a href="javascript:void(0);">《机构协议》</a><a href="javascript:void(0);">《用户协议》</a>及<a href="javascript:void(0);">《隐私权政策》</a>
+                        <p><input type="checkbox">我已阅读并同意<a href="javascript:void(0);">《机构协议》</a><a href="javascript:void(0);">《用户协议》</a>及<a href="javascript:void(0);">《隐私权政策》</a></p>
                         <button class="btn" type="button" @click="clubRegister()">注册</button>
                     </div>
                 </form>
@@ -211,7 +212,7 @@
                         <span class="errTips icon mIcon" tips="请选择或添加主营产品"></span>
                     </div>
                     <div class="subLine">
-                        <input type="checkbox">我已阅读并同意<a href="javascript:void(0);">《供应商协议》</a><a href="javascript:void(0);">《用户协议》</a>及<a href="javascript:void(0);">《隐私权政策》</a>
+                        <p><input type="checkbox">我已阅读并同意<a href="javascript:void(0);">《供应商协议》</a><a href="javascript:void(0);">《用户协议》</a>及<a href="javascript:void(0);">《隐私权政策》</a></p>
                         <button class="btn" type="button" @click="supplierRegister()">同意并提交审核</button>
                     </div>
                 </form>

src/main/resources/templates/account/upgrade.html

@@ -4,6 +4,7 @@
 <head>
     <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
     <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/base/form.css(v=${version})}" rel="stylesheet" type="text/css">
     <link th:href="@{/css/account/upgrade.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body>

src/main/resources/templates/maintenance/form.html

@@ -4,6 +4,7 @@
 <head>
     <title>采美365网-维修申请</title>
     <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/base/form.css(v=${version})}" rel="stylesheet" type="text/css">
     <link th:href="@{/css/maintenance/form.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body>
@@ -12,7 +13,62 @@
 
 <!-- 维修申请 -->
 <div id="maintenanceForm">
-
+    <div class="maintenance">
+        <h1 class="title">申请维修</h1>
+        <p class="desc">未注册用户可直接填写维修申请；已注册用户为了方便您查看后续服务进展，请在登录账号后再填写维修申请。</p>
+        <form>
+            <div class="formLine">
+                <p><em>*</em>问题描述：</p>
+                <textarea  v-model.trim="postData.question" placeholder="请输入您的问题描述(不超过200字)…" maxlength="200" needverify></textarea>
+                <i class="checked icon mIcon"></i>
+                <span class="errTips icon mIcon" tips="请输入您的问题描述"></span>
+            </div>
+            <div class="formLine">
+                <p><em>*</em>联系人：</p>
+                <input type="text" v-model.trim="postData.linkman" placeholder="请输入联系人姓名" :rule="rule.name" maxlength="50" @blur="blurHandle($event)" needverify>
+                <i class="checked icon mIcon"></i>
+                <span class="errTips icon mIcon" tips="请输入正确的联系人姓名"></span>
+            </div>
+            <div class="formLine">
+                <p><em>*</em>联系电话：</p>
+                <input type="text" v-model.trim="postData.phone" placeholder="请输入联系电话" :rule="rule.phone" maxlength="12" @blur="blurHandle($event)" needverify>
+                <i class="checked icon mIcon"></i>
+                <span class="errTips icon mIcon" tips="请输入有效的联系电话"></span>
+            </div>
+            <div class="formLine">
+                <p><em>*</em>联系地址：</p>
+                <div class="address">
+                    <select><option value="">请选择</option></select>
+                    <select><option value="">请选择</option></select>
+                    <select><option value="">请选择</option></select>
+                    <textarea v-model.trim="postData.address" placeholder="建议您如实填写详细收货地址，例如：街道名称，门牌号码，楼层和房间号等信息"></textarea>
+                </div>
+                <i class="checked icon mIcon"></i>
+                <span class="errTips icon mIcon" tips="请输入正确的联系地址"></span>
+            </div>
+            <div class="formLine">
+                <p><em>*</em>仪器名称：</p>
+                <input type="text" v-model.trim="postData.name" placeholder="请输入仪器名称" :rule="rule.name" maxlength="50" @blur="blurHandle($event)" needverify>
+                <i class="checked icon mIcon"></i>
+                <span class="errTips icon mIcon" tips="请输入正确的仪器名称"></span>
+            </div>
+            <div class="formLine">
+                <p>生产厂家：</p>
+                <input type="text" v-model.trim="postData.shopName" placeholder="请输入生产厂家" :rule="rule.name" maxlength="50" @blur="blurHandle($event)">
+                <i class="checked icon mIcon"></i>
+                <span class="errTips icon mIcon" tips="请输入正确的公司名称"></span>
+            </div>
+            <div class="formLine">
+                <p>上传图片：</p>
+                <input type="file" v-model="postData.image">
+                <span class="errTips icon mIcon"></span>
+                <p class="fileInfo">请尽量上传仪器全照或者仪器故障图片，方便您的维修事宜上传jpg/png格式照片，单个照片不能超过5M,最多不超过5张</p>
+            </div>
+            <div class="subLine">
+                <button class="btn" type="button" @click="submitData()">提交</button>
+            </div>
+        </form>
+    </div>
 </div>
 
 <!-- 引入底部 -->