Procházet zdrojové kódy

Merge branch 'dev' of ssh://10.10.100.21/source/saas-platform into dev

guq před 7 roky
rodič
revize
3753948483

+ 182 - 45
frontend/saas-portal-web/src/css/main.css

@@ -96,8 +96,19 @@ main > section {
     z-index: 5;
 }
 /* 登录弹窗 */
-input {
+/* input {
     outline: none;
+} */
+.tishi {
+    font-size: 12px;
+    color: #FF6A1A;
+    position: absolute;
+    left: 42px;
+    margin-top: -3px;
+}
+.tishi img {
+    margin-top: -4px;
+    margin-right: 10px;
 }
 .box,.box-zc{
     display:none;
@@ -291,11 +302,11 @@ input {
 /* 首页内容 ..........................................*/
 .my-text {
     position: absolute;
-    top: 200px;
-    left: 136px;
+    top: 448px;
+    left: 100px;
     /* z-index: 5; */
-    width: 468px;
-    height: 300px;
+    /* width: 468px;
+    height: 300px; */
 }
 .sy-dianzi {
     width: 100%;
@@ -335,9 +346,55 @@ input {
     right: 130px;
 }
 /* 特色 .......................................*/
+.ts-worp {
+    width: 100%;
+    padding: 0;
+    margin: 0;
+}
 .ts-box {
     overflow: hidden;
     margin-top: 50px;
+    position: relative;
+}
+.ts-minimg {
+    width: 773px;
+    height: 615px;
+    position: absolute;
+    top: -35px;
+    right: 0;
+}
+.ts-mintext {
+    position: absolute;
+    top: 142px;
+    right: 380px;
+    color: white;
+}
+.ts-mintext p {
+    font-size: 26px!important;
+    text-align: left;
+    margin-bottom: 24px;
+}
+.ts-textimg {
+    width: 40px;
+    margin-left: -40px;
+}
+.ts-lefttext {
+    left: 300px;
+    width: 280px;
+}
+.ts-textleftimg {
+    width: 40px;
+    margin-right: -40px;
+}
+.ts-lefttext p {
+    text-align: right;
+}
+.ts-title {
+    font-family: PingFangSC-Regular !important;
+    color: #0D253E !important;
+    font-size: 24px !important;
+    margin-bottom: 14px;
+    font-weight: 600;
 }
 .left {
     float: left;
@@ -346,7 +403,8 @@ input {
     float: right;
 }
 .ts-img {
-    width: 500px;
+    width: 108%;
+    height: 441px;
 }
 .right-text {
     text-align: right;
@@ -354,54 +412,145 @@ input {
 .left-text {
     text-align: left;
 }
+.ts-text {
+    font-family: PingFangSC-Regular !important;
+    color: #9EA8B2 !important;
+}
 
 /* 功能 .........................................*/
-.gn-img {
+.gn-beijing {
     width: 100%;
+    position: absolute;
+    top: 242px;
+}
+.gn-img {
+    width: 100px;
+    height: 100px;
+    border-radius: 50%;
+    background: #1E88F5;
+    text-align: center;
+    line-height: 100px;
+    margin: 0 auto;
+    position: relative;
+    margin-top: 12px;
+}
+.gn-img img {
+    width: 50%;
+}
+.gn-huise {
+    background: #F4F8FC;
+}
+.gn-xiaoqiu {
+    width: 30px;
+    height: 30px;
+    border-radius: 50%;
+    background: #FFCC01;
+    box-shadow: 0 0 15px 0 rgba(255,204,1,0.40);
+    position: absolute;
+    top: 0;
+    right: 0;
+}
+.gn-left {
+    left: 0;
 }
 .gn-hei>div {
     height: 240px;
 }
-
+.service-item {
+    margin-bottom: 60px;
+    padding:0 14px;
+    text-align: center;
+}
+.gn-text {
+    font-family: PingFangSC-Regular;
+    font-size: 18px;
+    color: #0D253E;
+    font-weight: 600;
+    margin-top: 12px;
+}
+.gn-color {
+    color: #1E88F5;
+}
 /* 帮助 ........................................*/
-.bz-box {
+.bz-worp {
+    background: white;
     width: 80%;
     margin: 0 auto;
+    padding: 40px;
+}
+.bz-box {
+    border: 1px solid #1E88F5;
+    border-radius: 5px;
+    border-right: 0;
+}
+.bz-sskuang {
+    width: 90%;
+    float: left;
+    line-height: 38px;
 }
 .bz-sousuo {
-    width: 80%;
+    width: 94%;
     margin: 0 -5px;
+    border: 0;
+    outline: none;
+}
+.bz-sousuoimg {
+    margin: -3px 10px 0 14px;
+}
+.bz-btn {
+    background: #1E88F5;
+    border-radius: 0 5px 5px 0;
+    width: 10%;
+    border: 0;
+    color: white;
+    height: 40px;
 }
 .bz-content {
     margin-top: 30px;
-    
+    border: 0;
 }
 .bz-left {
-    width: 10%;
-}
-.bz-left button {
     width: 100%;
-    background: white;
-    border: 0;
-    height: 30px;
+    overflow: hidden;
 }
-.actvin {
-    background: #444 !important;
-    color: white;
+.bz-ul {
+    border-bottom: 1px solid #D8D8D8;
+    overflow: hidden; 
+    margin-left: -40px;
+}
+.bz-left li {
+    float: left;
+    width: 50%;
+    list-style: none;
+    text-align: center;
+    height: 40px;
+    cursor:pointer;
+}
+.active {
+    border-bottom: 5px solid #FFCC01;
 }
 .bz-right {
-    width: 90%;
+    width: 100%;
     background: white;
-    height: 500px;
+}
+.bz-yuandian {
+    background: #FFCC01;
+    width: 16px;
+    height: 16px;
+    border-radius: 50%;
+    margin: 4px 8px 0 0;
 }
 .bz-right-conent div {
     display: none;
 }
 .bz-right-conent li {
-    margin-bottom: 20px;
+    margin-bottom: 14px;
+    list-style: none;
+    overflow: hidden;
+    margin-left: -40px;
 }
 .bz-right-conent {
-    margin: 30px;
+    /* margin: 30px; */
 }
 /* 底部 ...................................*/
 /*footer*/
@@ -409,9 +558,13 @@ input {
     width: 100%;
     background: #383838;
 }
+.db-text {
+    background: white;
+    color: #000;
+}
 .footer .container{
     margin: 0 auto;
-    width: 1200px;
+    width: 80%;
     height: 445px;
     overflow: hidden;
     text-align: center;
@@ -472,7 +625,7 @@ input {
     color: #fff;
 }
 .footer-section .qr{
-    width: 220px;
+    width: 110px;
     overflow: hidden;
     text-align: right;
 }
@@ -821,7 +974,7 @@ h1.navbar-brand {
     line-height: 1.5;
 }
 .slider-1 {
-    background-image: url(../img/assets/beijing.png);
+    background-image: url(../img/assets/beijing2x.png);
 }
 .sl-slider-wrapper {
     width: 100%;
@@ -1109,27 +1262,11 @@ h1.navbar-brand {
          -o-transition: all 0.3s ease 0s;
             transition: all 0.3s ease 0s;
 }
-.service-item {
-    margin-bottom: 60px;
-    padding:0 14px;
-}
 .service-icon i {
     font-size: 60px;
     color: #0aa6bd;
 }
 
-.service-item h3 {
-    font-size: 13px;
-    font-weight: 600;
-    margin-top: 10px;
-    margin-bottom: 20px;
-    color: #3c3d41;
-    text-transform: uppercase;
-}
-.service-item p {
-    color: #7e848e;
-    font-weight: 200;
-}
 
 
 
@@ -1886,9 +2023,9 @@ textarea.form-control {
         margin-bottom: 50px;
     }
 
-    .service-item {
+    /* .service-item {
         margin-bottom: 50px;
-    }
+    } */
 /* testimonial */
     .testimonial-item {
         width: 100%;

binární
frontend/saas-portal-web/src/img/assets/1.png


binární
frontend/saas-portal-web/src/img/assets/2.png


binární
frontend/saas-portal-web/src/img/assets/beijing2x.png


binární
frontend/saas-portal-web/src/img/assets/fen xi@2x.png


binární
frontend/saas-portal-web/src/img/assets/kuaisu@2x.png


binární
frontend/saas-portal-web/src/img/assets/sou.png


binární
frontend/saas-portal-web/src/img/assets/tishi1x.png


binární
frontend/saas-portal-web/src/img/assets/xunzhao@2x.png


binární
frontend/saas-portal-web/src/img/gongneng/ xiao shou 3@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/FEN XI 8@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/QIAN BAO 7@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/cai gou 4@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/cang ku 5@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/jia gong 6@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/ren wu 1@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/xu xian@3x.png


binární
frontend/saas-portal-web/src/img/gongneng/zi yuan 2@3x.png


+ 251 - 197
frontend/saas-portal-web/src/index.html

@@ -111,14 +111,16 @@
 						<div class="tc-phone">
 							<div class="tc-phonebox">
 								<span><img src="./img/assets/phone.png"></span>
-								<input type="text" class="tc-phonecon" placeholder="请输入您的手机号" name="phone" id="phone">
+								<input type="text" class="tc-phonecon" placeholder="请输入您的手机号" name="zc-phone" id="zc-phone">
 							</div>
+							<span class="tishi zc-phone"></span>
 						</div>
 						<div class="tc-over">
 							<div class="tc-phone left" style="margin: 0 0 16px 0;">
 								<div class="tc-phonebox">
-									<input type="text" class="tc-yanzhengma tc-shibiema" name="" id="">
+									<input type="text" class="tc-yanzhengma tc-shibiema" name="zc-tuxingma" id="zc-tuxingma">
 								</div>
+								<span class="tishi"><img src="./img/assets/tishi1x.png"/>验证错误</span>
 							</div>
 							<div class="left"><img class="tc-yanzhengimg" src="./img/assets/timg.jpg" alt=""></div>
 							<div class="right" style="line-height: 40px;"><img src="./img/assets/shuaxin.png" alt=""></div>
@@ -126,9 +128,10 @@
 						<div style="width: 100%;">
 							<div class="tc-phone left" style="margin: 0 0 16px 0;">
 								<div class="tc-phonebox">
-										<span><img src="./img/assets/yanzhengma.png"></span>
-										<input type="text" class="tc-yanzhengma" placeholder="请输入验证码" name="" id="">
+									<span><img src="./img/assets/yanzhengma.png"></span>
+									<input type="text" class="tc-yanzhengma" placeholder="请输入验证码" name="zc-yanzhengma" id="zc-yanzhengma">
 								</div>
+								<span class="tishi"><img src="./img/assets/tishi1x.png"/>验证错误</span>
 							</div>
 							<button class="tc-huoqu right">获取验证码</button>
 						</div>
@@ -161,17 +164,19 @@
 						<div class="tc-phone">
 							<div class="tc-phonebox">
 								<span><img src="./img/assets/phone.png"></span>
-								<input type="text" class="tc-phonecon" placeholder="手机号/优软云账号" name="phone" id="phone">
+								<input type="text" class="tc-phonecon" placeholder="手机号/优软云账号" name="zh-phone" id="zh-phone">
 							</div>
+							<span class="tishi zh-phone"></span>
 						</div>
 						<div class="tc-phone">
 							<div class="tc-phonebox">
 								<span><img src="./img/assets/password.png"></span>
-								<input type="password" class="tc-phonepwd" placeholder="请输入您的密码" name="pwd" id="pwd">
+								<input type="password" class="tc-phonepwd" placeholder="请输入您的密码" name="pwd" id="zh-pwd">
 							</div>
+							<span class="tishi"><img src="./img/assets/tishi1x.png"/>验证错误</span>
 						</div>
 						<div>
-							<button class="tc-login-pwd" id="login-pwd">登录</button>
+							<button class="tc-login-pwd" id="zh-login">登录</button>
 						</div>
 					</form>
 					<div class="tc-over" id="qiehuan">
@@ -204,20 +209,22 @@
 						<div class="tc-phone">
 							<div class="tc-phonebox">
 								<span><img src="./img/assets/phone.png"></span>
-								<input type="text" class="tc-phonecon" placeholder="请输入您的手机号" name="phone" id="phone">
+								<input type="text" class="tc-phonecon" placeholder="请输入您的手机号" name="dx-phone" id="dx-phone">
 							</div>
+							<span class="tishi dx-phone"></span>
 						</div>
 						<div style="width: 100%;">
 							<div class="tc-phone left" style="margin: 0 0 16px 0;">
 								<div class="tc-phonebox">
-										<span><img src="./img/assets/yanzhengma.png"></span>
-										<input type="text" class="tc-yanzhengma" placeholder="请输入验证码" name="" id="">
+									<span><img src="./img/assets/yanzhengma.png"></span>
+									<input type="text" class="tc-yanzhengma" placeholder="请输入验证码" name="dx-yanzhengma" id="dx-yanzhengma">
 								</div>
+								<span class="tishi"><img src="./img/assets/tishi1x.png"/>验证错误</span>
 							</div>
 							<button class="tc-huoqu right">获取验证码</button>
 						</div>
 						<div>
-							<button class="tc-login-pwd" id="login-pwd">登录</button>
+							<button class="tc-login-pwd" id="dx-login">登录</button>
 						</div>
 					</form>
 					<div class="tc-over" id="qiehuan">
@@ -252,7 +259,7 @@
 						</div>
 						<!-- 首页内容 -->
 						<div class="my-text">
-							<img class="sy-dianzi sy-mb" src="./img/assets/dianzi3x.png" alt="">
+							<!-- <img class="sy-dianzi sy-mb" src="./img/assets/dianzi3x.png" alt="">
 							<div class="sy-mb">
 								<img src="./img/assets/xun3x.png" alt="">
 								<img class='sy-mbimg2' src="./img/assets/jin3x.png" alt="">
@@ -264,10 +271,10 @@
 							<div class="sy-mb">
 								<img src="./img/assets/Group3x.png" alt="">
 								<img src="./img/assets/qing3x.png" alt="">
-							</div>
+							</div> -->
 							<button class='my-tiyan'>立即体验</button> 
 						</div>
-						<div class="sy-img"><img class="chrw" src="./img/assets/chatu.png" alt=""></div>
+						<!-- <div class="sy-img"><img class="chrw" src="./img/assets/chatu.png" alt=""></div> -->
 						<div class="slide-caption">
                         	<div class="caption-content"></div>
                     	</div>
@@ -280,116 +287,143 @@
 			
 			<!-- 特色 -->
 			<section id="feature">
-				<div class="container">
-					<div class="row">
+				<div class="container ts-worp">
 						<div class="section-title text-center">
-							<h2>特色</h2>
-							<p>云端连接 简单易用</p>
+							<p class="ts-title">我们的特色</p>
+							<p class="ts-text">云端部署 &nbsp;&nbsp; 轻量应用</p>
 						</div>
 						<div class="ts-box">
-							<div class="left col-md-8">
+							<div class="left" style="margin:50px 0;">
 								<img  class="ts-img" src="img/features.jpg" alt="">
 							</div>
-							<div class="right right-text col-md-4">
-								<p>迅速找到您想要的</p>
-								<p>寻找供应商资源</p>
-								<p>寻找产品资料 货源</p>
+							<div class="right right-text">
+								<img class="ts-minimg" src="./img/assets/1.png" alt="">
+								<div class="ts-mintext">
+									<p><img class="ts-textimg" src="./img/assets/xunzhao@2x.png" alt="">迅速找到您想要的</p>
+									<p>寻找供应商资源</p>
+									<p>寻找产品资料 货源</p>
+								</div>
 							</div>
 						</div>
 						<div class="ts-box">
-							<div class="left left-text col-md-4">
-								<p>直观看到您想看的</p>
-								<p>月度销售额 采购额</p>
-								<p>经营指标实时看</p>
+							<div class="left left-text">
+								<img class="ts-minimg" style="left:0;" src="./img/assets/2.png" alt="">
+								<div class="ts-mintext ts-lefttext">
+									<p>直观看到您想看的<img class="ts-textleftimg" src="./img/assets/fen xi@2x.png" alt=""></p>
+									<p>月度销售额 采购额</p>
+									<p>经营指标实时看</p>
+								</div>
 							</div>
-							<div class="right">
+							<div style="margin:50px 0;">
 								<img  class="ts-img" src="img/features.jpg" alt="">
 							</div>
 						</div>
 						<div class="ts-box">
-							<div class="left col-md-8">
+							<div class="left" style="margin:50px 0;">
 								<img  class="ts-img" src="img/features.jpg" alt="">
 							</div>
-							<div class="right right-text col-md-4">
-								<p>快速上手 生意简单做</p>
-								<p>移动端的体验</p>
-								<p>简单的业务线 让您三分钟上手</p>
+							<div class="right right-text">
+								<img class="ts-minimg" src="./img/assets/1.png" alt="">
+								<div class="ts-mintext" style="right: 250px;">
+									<p><img class="ts-textimg" src="./img/assets/kuaisu@2x.png" alt="">快速上手 生意简单做</p>
+									<p>移动端的体验</p>
+									<p>简单的业务线 让您三分钟上手</p>
+								</div>
 							</div>
 						</div>
-					</div>
 				</div>
 			</section>
 
 			<!-- Service section 功能-->
 			<section id="service">
-				<div class="container">
+				<div class="container" style="position: relative;">
+					<img class="gn-beijing" src="./img/gongneng/xu xian@3x.png" alt="">
 					<div class="row">
 						<div class="section-title text-center">
-							<h2>功能</h2>
+							<p class="ts-title">我们的功能</p>
 						</div>
 						<div class="gn-hei">
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<p class="gn-text gn-color">任务管理</p>
+									<p>任务分配,高效工作</p>
+									<p>管好每一件事</p>
+									<div class="gn-img">
+										<img src="./img/gongneng/ren wu 1@3x.png" alt="">
 									</div>
-									<p>任务分配,高效工作,管好每一件事</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<p class="gn-text">资源管理</p>
+									<p>一键查询,海量供应商产品信息</p>
+									<p>节约时间</p>
+									<div class="gn-img gn-huise">
+										<img src="./img/gongneng/zi yuan 2@3x.png" alt="">
 									</div>
-									<p>一键查询,海量供应商产品信息,节约时间</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<p class="gn-text">销售管理</p>
+									<p>快速制单</p>
+									<p>利润实时算</p>
+									<div class="gn-img">
+										<img src="./img/gongneng/ xiao shou 3@3x.png" alt="">
+										<div class="gn-xiaoqiu"></div>
 									</div>
-									<p>快速制单,利润实时算</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<p class="gn-text">采购管理</p>
+									<p>寻源.定价.采购</p>
+									<p>一条流程</p>
+									<div class="gn-img gn-huise">
+										<img src="./img/gongneng/cai gou 4@3x.png" alt="">
 									</div>
-									<p>寻源,定价,采购,一条流程</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<div class="gn-img gn-huise">
+										<img src="./img/gongneng/cang ku 5@3x.png" alt="">
+										<div class="gn-xiaoqiu"></div>
 									</div>
-									<p>库存盘点,库存账龄,呆滞分析</p>
+									<p class="gn-text">仓库管理</p>
+									<p>库存盘点,库存账龄</p>
+									<p>呆滞分析</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<div class="gn-img">
+										<img src="./img/gongneng/jia gong 6@3x.png" alt="">
 									</div>
-									<p>BOM成本及时看,加工单自动出入库作业</p>
+									<p class="gn-text">加工管理</p>
+									<p>BOM成本及时看</p>
+									<p>加工单自动出入库作业</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<div class="gn-img gn-huise">
+										<img src="./img/gongneng/QIAN BAO 7@3x.png" alt="">
 									</div>
-									<p>清晰核算,实时查看供应商和客户账款情况</p>
+									<p class="gn-text">资金管理</p>
+									<p>清晰核算</p>
+									<p>实时查看供应商和客户账款情况</p>
 								</div>
 							</div>
 							<div class="col-md-3 col-sm-6 col-xs-12">
 								<div class="service-item">
-									<div>
-										<img class="gn-img" src="img/features.jpg" alt="">
+									<div class="gn-img">
+										<img src="./img/gongneng/FEN XI 8@3x.png" alt="">
+										<div class="gn-xiaoqiu gn-left"></div>
 									</div>
-									<p>直观数据看板,看库存分析,收款分析,付款分析</p>
+									<p class="gn-text gn-color">智能分析</p>
+									<p>直观数据看板,看库存分析</p>
+									<p>收款分析,付款分析</p>
 								</div>
 							</div>
 						</div>
@@ -403,42 +437,63 @@
 				<div class="container">
 					<div class="row">
 						<div class="section-title text-center">
-							<h2>帮助中心</h2>
-						</div>
-						<div class="bz-box">
-							<select style="margin-top: -1px;height:30px;width: 10%">
-								<option value ="volvo">操作文档</option>
-								<option value ="saab">常见问题</option>
-							</select>
-							<input class="bz-sousuo" type="text" placeholder="输入标题搜索"/>
-							<button style="width:10%">搜索</button>
+							<p class="ts-title">帮助中心</p>
 						</div>
-						<div class="bz-box bz-content">
-							<div class="left bz-left">
-								<button class="actvin">操作文档</button>
-								<button>常见问题</button>
+						<div class="bz-worp">
+							<div class="bz-box">
+								<div class="bz-sskuang">
+									<span><img class="bz-sousuoimg" src="./img/assets/sou.png" alt=""></span>
+									<input class="bz-sousuo" type="text" placeholder="输入标题搜索"/>
+								</div>
+								<button class="bz-btn">搜索</button>
 							</div>
-							<div class="right bz-right">
-								<div class="bz-right-conent">
-									<div>
-										<ul>
-											<li>XXXXXXXXXXXXXXX操作文档</li>
-											<li>XXXXXXXXXXXXXXX操作文档</li>
-											<li>XXXXXXXXXXXXXXX操作文档</li>
-											<li>XXXXXXXXXXXXXXX操作文档</li>
-											<li>XXXXXXXXXXXXXXX操作文档</li>
-											<li>XXXXXXXXXXXXXXX操作文档</li>
-										</ul>
-									</div>
-									<div>
-										<ul>
-											<li>XXXXXXXXXXXXXXX常见问题</li>
-											<li>XXXXXXXXXXXXXXX常见问题</li>
-											<li>XXXXXXXXXXXXXXX常见问题</li>
-											<li>XXXXXXXXXXXXXXX常见问题</li>
-											<li>XXXXXXXXXXXXXXX常见问题</li>
-											<li>XXXXXXXXXXXXXXX常见问题</li>
-										</ul>
+							<div class="bz-content">
+								<div class="bz-left">
+									<ul class="bz-ul">
+										<li class='active'>操作文档</li>
+										<li>常见问题</li>
+									</ul>
+								</div>
+								<div class="bz-right">
+									<div class="bz-right-conent">
+										<div>
+											<ul>
+												<li>
+													<span class="left bz-yuandian"></span>
+													<span class="left">方式不同吧好像是差不多哇来访黑哇哦发检测句ID回复开展了好xxxxx操作文档 </span>
+													<span class="right">2018年10月31日  12:00</span>
+												</li>
+												<li>
+													<span class="left bz-yuandian"></span>
+													<span class="left">XXXXXXXXXXXXXXX操作文档</span>
+													<span class="right">2018年10月31日  12:00</span>
+												</li>
+												<li>
+													<span class="left bz-yuandian"></span>
+													<span class="left">XXXXXXXXXXXXXXX操作文档</span>
+													<span class="right">2018年10月31日  12:00</span>
+												</li>
+											</ul>
+										</div>
+										<div>
+											<ul>
+												<li>
+													<span class="left bz-yuandian"></span>
+													<span class="left">方式不同吧好像是差不多哇来访黑哇哦发检测句ID回复开展了好xxxxx常见问题 </span>
+													<span class="right">2018年10月31日  12:00</span>
+												</li>
+												<li>
+													<span class="left bz-yuandian"></span>
+													<span class="left">方式不同吧好像是差不多哇来访黑哇哦发检测句ID回复开展了好xxxxx常见问题</span>
+													<span class="right">2018年10月31日  12:00</span>
+												</li>
+												<li>
+													<span class="left bz-yuandian"></span>
+													<span class="left">XXXXXXXXXXXXXXX常见问题</span>
+													<span class="right">2018年10月31日  12:00</span>
+												</li>
+											</ul>
+										</div>
 									</div>
 								</div>
 							</div>
@@ -499,17 +554,16 @@
 						<!--<div class="time">意见反馈:usoftmall.com</div>-->
 					</div>
 					<div class="link">
-						<ul>
-							<li><span>帐号中心</span></li>
-							<li><a href="http://uas.ubtob.com/serve#/self/find_account">找回帐号密码</a></li>
-							<li><a href="http://uas.ubtob.com/serve#/self/account_excetion">帐号无法登录</a></li>
-							<li><a href="http://uas.ubtob.com/serve#/self/modify_pwd/4.1">修改密码</a></li>
-						</ul>
 						<ul>
 							<li><span>帮助中心</span></li>
-							<li><a href="#">操作视频</a></li>
-							<li><a href="#">操作文档</a></li>
 							<li><a href="#">常见问题</a></li>
+							<li><a href="#">操作手册</a></li>
+						</ul>
+						<ul>
+							<li><span>公司</span></li>
+							<li><a href="#">关于我们</a></li>
+							<li><a href="#">企业文化</a></li>
+							<li><a href="https://www.usoftchina.com/contact">联系我们</a></li>
 						</ul>
 						<!-- <ul>
 							<li><span>闯客网</span></li>
@@ -518,40 +572,40 @@
 							<li><a href="https://www.uuzcc.com/article/detail/13456.html">服务商规则</a></li>
 						</ul> -->
 						<ul>
-							<li><span>关于我们</span></li>
-							<li><a class="no-link">优软云介绍</a></li>
-							<li><a class="no-link">发展历程</a></li>
-							<li><a href="https://www.usoftchina.com/contact">联系我们</a></li>
+							<li><span>产品</span></li>
+							<li><a class="no-link">u企云服</a></li>
+							<li><a class="no-link">u软商城</a></li>
+							<li><a href="#">u智融</a></li>
+							<li><a href="#">u创客</a></li>
 						</ul>
 					</div>
+					
 					<div class="qr">
 						<div class="qr-top">
 							<div class="qr-tech qr-code">
 								<img src="./img/qr-tech.png" alt="">
-								科技公众号
+								<div class="db-text">
+									<span>科技公众号</span>
+								</div>
 							</div>
-							<div class="qr-mall qr-code">
+							
+							<!-- <div class="qr-mall qr-code">
 								<img src="./img/qr_mall.jpg" alt="">
 								商城公众号
-							</div>
+							</div> -->
 						</div>
-						<div class="qr-bottom">
+						<!-- <div class="qr-bottom">
 							粤ICP备15112126号
 							<br/>2018 © 深圳市优软科技有限公司
-						</div>
+						</div> -->
 					</div>
 				</div>
-				<div class="friend-link">
+				<div class="friend-link" style="margin-top: 100px;">
 					<ul style="margin-left: -40px;">
-						<li><span>友情链接:</span></li>
-						<li><a href="http://www.worldshine.net">深圳华商龙</a></li>
-						<li><a href="http://www.yitoa.com">深圳市英唐智能科技</a></li>
-						<li><a href="http://uas.usoftchina.com">深圳市优软科技</a></li>
-						<li><a href="http://www.51cube.com">酷比魔方</a></li>
-						<li><a href="http://www.szsoling.com/home">SOLING索菱</a></li>
-						<li><a href="http://www.huashangweitai.com">深圳市华商维泰显示科技</a></li>
-						<li><a href="http://www.szmadigi.com">迈迪杰科技</a></li>
-						<li><a href="http://www.hi-mantech.com">怡海能达</a></li>
+						<li><span>常用链接:</span></li>
+						<li><a href="#">uas官网</a></li>
+						<li><a href="#">u软云</a></li>
+						<li><a href="#">英唐官网</a></li>
 					</ul>
 				</div>
 			</div>
@@ -581,83 +635,83 @@
 		<!-- onscroll animation -->
         <script src="js/wow.min.js"></script>
 		<!-- Custom Functions jq表单提交插件-->
-        <script src="js/jquery.form.min.js"></script>
-        <script src="js/jquery.validate.min.js"></script>
+        <!-- <script src="js/jquery.form.min.js"></script> -->
+        <!-- <script src="js/jquery.validate.min.js"></script> -->
         <script src="js/main.js"></script>
         <script>
-        	$(function() {
-				$.validator.addMethod("isMobile", function(value, element) {       
-					var length = value.length;   
-					var mobile = /^[1][3,4,5,7,8][0-9]{9}$/;   
-					return this.optional(element) || (length == 11 && mobile.test(value));       
-				}, "请正确填写您的手机号码");
-    			$("#contact-form").validate({//自定义验证规则
-    				rules: {
-    					phone: {
-							required: true,
-							isMobile:true
-    						// minlength: 8
-						},
-						// realName: "required",
-    		            email: {
-    		                required: true,
-    		                email: true
-    		            },
-    					subject: {
-    						required: true,
-    		                minlength: 2
-    					},
-    					message: {
-    						required: true,
-    		                minlength: 2
-    					}
-    				},
-					messages: {//提示文字
-						phone: {
-							required: "号码不能为空",
-							// telephone: '请填写正确的手机号'
-						},
-    					// name: {
-    					// 	required: "姓名不能为空",
-    					// 	minlength: "至少输入8位字母和数字"
-    					// },
-    		            email: {
-							required: "没有电子邮件",
-							email: "请输入正确格式的电子邮件",
-    		            },
-    					subject: {
-    						required: "你有理由联系,把它写在这里",
-    		                minlength: "这一切?真的?"
-    					},
-    					message: {
-    						required: "嗯……嗯,你必须写一些东西寄这张表格。",
-    						minlength: "这一切?真的?"
-    					}
-    				},
-    				submitHandler: function(form) {
-    					$(form).ajaxSubmit({//jq表单提交
-    						type:"POST",
-    						data: $(form).serialize(),//获取form中的所有数据
-    						url:"mail.php",
-    						success: function() {
-    							$(".contact-form").fadeTo( "slow", 1, function() {
-    		                        $(".contact-form").resetForm();//清空form
-    								$(".success").slideDown("slow");//滑动方式显示隐藏元素
-    							});
-    						},
-    						error: function() {
-    							$(".contact-form").fadeTo( "slow", 1, function() {
-    								$(".error").slideDown("slow");
-    							});
-    						}
-    					});
-    				},
-    		        errorPlacement: function(error, element) {
-    		            element.after(error);
-    		            error.hide().slideDown();
-    		        }
-    			});
-			});
+        	// $(function() {
+			// 	$.validator.addMethod("isMobile", function(value, element) {       
+			// 		var length = value.length;   
+			// 		var mobile = /^[1][3,4,5,7,8][0-9]{9}$/;   
+			// 		return this.optional(element) || (length == 11 && mobile.test(value));       
+			// 	}, "请正确填写您的手机号码");
+    		// 	$("#contact-form").validate({//自定义验证规则
+    		// 		rules: {
+    		// 			phone: {
+			// 				required: true,
+			// 				isMobile:true
+    		// 				// minlength: 8
+			// 			},
+			// 			// realName: "required",
+    		//             email: {
+    		//                 required: true,
+    		//                 email: true
+    		//             },
+    		// 			subject: {
+    		// 				required: true,
+    		//                 minlength: 2
+    		// 			},
+    		// 			message: {
+    		// 				required: true,
+    		//                 minlength: 2
+    		// 			}
+    		// 		},
+			// 		messages: {//提示文字
+			// 			phone: {
+			// 				required: "号码不能为空",
+			// 				// telephone: '请填写正确的手机号'
+			// 			},
+    		// 			// name: {
+    		// 			// 	required: "姓名不能为空",
+    		// 			// 	minlength: "至少输入8位字母和数字"
+    		// 			// },
+    		//             email: {
+			// 				required: "没有电子邮件",
+			// 				email: "请输入正确格式的电子邮件",
+    		//             },
+    		// 			subject: {
+    		// 				required: "你有理由联系,把它写在这里",
+    		//                 minlength: "这一切?真的?"
+    		// 			},
+    		// 			message: {
+    		// 				required: "嗯……嗯,你必须写一些东西寄这张表格。",
+    		// 				minlength: "这一切?真的?"
+    		// 			}
+    		// 		},
+    				// submitHandler: function(form) {
+    				// 	$(form).ajaxSubmit({//jq表单提交
+    				// 		type:"POST",
+    				// 		data: $(form).serialize(),//获取form中的所有数据
+    				// 		url:"mail.php",
+    				// 		success: function() {
+    				// 			$(".contact-form").fadeTo( "slow", 1, function() {
+    		        //                 $(".contact-form").resetForm();//清空form
+    				// 				$(".success").slideDown("slow");//滑动方式显示隐藏元素
+    				// 			});
+    				// 		},
+    				// 		error: function() {
+    				// 			$(".contact-form").fadeTo( "slow", 1, function() {
+    				// 				$(".error").slideDown("slow");
+    				// 			});
+    				// 		}
+    				// 	});
+    				// },
+    		//         errorPlacement: function(error, element) {
+    		//             element.after(error);
+    		//             error.hide().slideDown();
+    		//         }
+    		// 	});
+			// });
 			// 关闭弹窗X
 			$(".tc-on").click(function(){
 				$('#box-zc').css('display','none');
@@ -716,7 +770,7 @@
 				$('#box-zc').css('display','none');
 			})
 
-
+		// ----------------
 			$("#callback").click(function(){
                 $("#bbb").css("display","none");
                 $("#aaa").css("display","block");

+ 50 - 15
frontend/saas-portal-web/src/js/main.js

@@ -32,25 +32,60 @@ jQuery(window).load(function(){
     //         alert("密码格式不对")
     //     }
     // })
-    // $("#phone").change(function(){
-    //     if (isPhone($(this).val())) {
-    //         return
-    //     } else {
-    //         alert("手机号码格式不对")
-    //     }
+    // 注册手机号验证
+    $("#zc-phone").bind('input propertychange',function(){
+        if (isPhone($(this).val())) {
+            $(".zc-phone").html("");
+            $(this).parent().parent().css('border','1px #D8DCE8 solid');
+            $(this).css('outline','');
+        } else {
+            $(".zc-phone").html("<img src='./img/assets/tishi1x.png'/>请输入正确的手机号码");
+            $(this).parent().parent().css('border','1px red solid');
+            $(this).css('outline','none');
+        }
+    })
+    // 账号手机号验证
+    $("#zh-phone").bind('input propertychange',function(){
+        if (isPhone($(this).val())) {
+            $(".zh-phone").html("");
+            $(this).parent().parent().css('border','1px #D8DCE8 solid');
+            $(this).css('outline','');
+        } else {
+            $(".zh-phone").html("<img src='./img/assets/tishi1x.png'/>请输入正确的手机号码");
+            $(this).parent().parent().css('border','1px red solid');
+            $(this).css('outline','none');
+        }
+    })
+    // 短信手机号验证
+    $("#dx-phone").bind('input propertychange',function(){
+        if (isPhone($(this).val())) {
+            $(".dx-phone").html("");
+            $(this).parent().parent().css('border','1px #D8DCE8 solid');
+            $(this).css('outline','');
+        } else {
+            $(".dx-phone").html("<img src='./img/assets/tishi1x.png'/>请输入正确的手机号码");
+            $(this).parent().parent().css('border','1px red solid');
+            $(this).css('outline','none');
+        }
+    })
+    // 账号登录
+    // $("#zh-login").click(function(){
+    //     let name = $("#zh-phone").val();
+    //     let pwd = $("#zh-pwd").val();
+    //     console.log('姓名是'+name+'密码是'+pwd)
     // })
-    // 登录点击
-    // $("#login-pwd").click(function(){
-    //     let name = $("#phone").val();
-    //     let pwd = $("#pwd").val();
+    // // 短信登录
+    // $("#dx-login").click(function(){
+    //     let name = $("#dx-phone").val();
+    //     let pwd = $("#dx-yanzhengma").val();
     //     console.log('姓名是'+name+'密码是'+pwd)
     // })
-    //注册点击
+    // // 注册点击
     // $("#zc-login").click(function(){
     //     let name = $("#zc-phone").val();
-    //     let pwd = $("#zc-password").val();
+    //     let tuxingma = $("#zc-tuxingma").val();
     //     let yanzheng  = $("#zc-yanzhengma").val();
-    //     console.log('姓名是'+name+'密码是'+pwd+'验证码是'+yanzheng)
+    //     console.log('姓名是'+name+'图形码是'+tuxingma+'验证码是'+yanzheng)
     // })
 
     // 注册协议按钮同意可以点击注册
@@ -66,12 +101,12 @@ jQuery(window).load(function(){
     
     // 帮助中心
     $(".bz-right-conent>div").eq(0).show()
-    let abtn = $(".bz-left").children('button').click(function(){
+    let abtn = $(".bz-ul").children('li').click(function(){
         console.log($(this).text())
         var _index = $(this).index();
         //让内容框的第 _index 个显示出来,其他的被隐藏
         $(".bz-right-conent>div").eq(_index).show().siblings().hide();
-        $(this).addClass("actvin").siblings().removeClass('actvin')
+        $(this).addClass("active").siblings().removeClass('active')
     });
 });