小屏手机样式调整

questionnair/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "version": "0.0.0",
   "scripts": {
   "scripts": {
     "ng": "ng",
     "ng": "ng",
-    "start": "ng serve",
+    "start": "ng serve --host 0.0.0.0",
     "build": "ng build",
     "build": "ng build",
     "test": "ng test",
     "test": "ng test",
     "lint": "ng lint",
     "lint": "ng lint",

questionnair/src/app/ask/ask.component.ts

@@ -49,6 +49,7 @@ export class AskComponent implements OnInit {
     // console.log('start', this.curPage)
     // console.log('start', this.curPage)
     if (this.curPage > 0) {
     if (this.curPage > 0) {
       const page2Answer = this.allAnswers[1]
       const page2Answer = this.allAnswers[1]
+      if(page2Answer){
         const optionId = page2Answer.questions[0].options[0].optionId
         const optionId = page2Answer.questions[0].options[0].optionId
         if (this.curPage == 5 || this.curPage == 6) {
         if (this.curPage == 5 || this.curPage == 6) {
           if (optionId == 1 || optionId == 3) {
           if (optionId == 1 || optionId == 3) {
@@ -77,6 +78,8 @@ export class AskComponent implements OnInit {
             return
             return
           }
           }
         }
         }
+      }
+      
       this.curPage--;
       this.curPage--;
       this.setCurPageData()
       this.setCurPageData()
     } else {
     } else {

questionnair/src/app/page17/page17.component.html

@@ -2,7 +2,7 @@
   <div class="title">
   <div class="title">
     <img src="assets/images/bg_17.png" />
     <img src="assets/images/bg_17.png" />
   </div>
   </div>
-  <div class="footer" style="margin-top: 20%;" (click)="getHref()">
+  <div class="footer" style="margin-top: 10%;" (click)="getHref()">
     <div>我知道了</div>
     <div>我知道了</div>
   </div>
   </div>
 </div>
 </div>

questionnair/src/app/page7/page7.component.html

 <div class="container">
 <div class="container">
   <div class="layout">
   <div class="layout">
     <div class="content">
     <div class="content">
+      <div class="twoContent">
           <div class="questionTitle">
           <div class="questionTitle">
               {{ this.curPageData['questions'][0]['questionName'] }}
               {{ this.curPageData['questions'][0]['questionName'] }}
             </div>
             </div>
@@ -27,4 +28,5 @@
             </ul>
             </ul>
       </div>
       </div>
     </div>
     </div>
+  </div>
 </div>
 </div>

questionnair/src/styles.css

@@ -18,7 +18,8 @@ ul li,ol li{
     list-style: none;
     list-style: none;
 }
 }
 .container{
 .container{
-    padding:0;
+    padding: 0;
+    height: 100%;
 }
 }
 .wrapper{
 .wrapper{
     display: flex;
     display: flex;
@@ -27,7 +28,6 @@ ul li,ol li{
 .layout{
 .layout{
     display: flex;
     display: flex;
     flex-direction: column;
     flex-direction: column;
-    overflow: hidden;
     padding:0 10px;
     padding:0 10px;
     height:100%;
     height:100%;
 }
 }
@@ -37,8 +37,8 @@ ul li,ol li{
 .tips{
 .tips{
     display: flex;
     display: flex;
     justify-content: center;
     justify-content: center;
-    height: 5.5em;
     align-items: center;
     align-items: center;
+    margin: 5%;
 }
 }
 .footer{
 .footer{
     display: flex;
     display: flex;
@@ -57,8 +57,9 @@ ul li,ol li{
     padding:10px 0;
     padding:10px 0;
 } */
 } */
 .content{
 .content{
-    max-height: 580px;
+    max-height: 510px;
     overflow: auto;
     overflow: auto;
+    -webkit-overflow-scrolling: touch;
 }
 }
 /* .layout.cityLayout .questionTitle{
 /* .layout.cityLayout .questionTitle{
     margin:0 10px;
     margin:0 10px;
@@ -86,7 +87,8 @@ ul li,ol li{
     display: flex;
     display: flex;
     width: 100%;
     width: 100%;
     position: absolute;
     position: absolute;
-    bottom: 5%;
+    bottom: 10px;
+    background-color: #fff;
     
     
 }
 }
 .content_footer div{
 .content_footer div{
@@ -108,6 +110,9 @@ ul li,ol li{
     flex: 0 0 60%;
     flex: 0 0 60%;
     font-weight: 500;
     font-weight: 500;
 }
 }
+.twoContent{
+    height: 100%;
+}
 .jobContent,.income,.cityContent{
 .jobContent,.income,.cityContent{
     width: 100%;
     width: 100%;
 }
 }