beizhu

src/pages/building/buildingdetail.vue

@@ -131,10 +131,6 @@ export default {
     text-align: center;
     }
 
-    .right{
-      color:A1A1A1;
-      font-size: 10px;
-    }
     }
 
   .housecenter{

src/pages/building/components/correlationdynamics.vue

@@ -1,73 +1,73 @@
-<template>
-    <div class="dynamics">
-        <div class="dynamicstitle">
-            <span class="titlecharacters">相关动态</span>
-        </div>
-        <hr class="line"/>
-        <van-collapse v-model="activeName" accordion>
-            <van-collapse-item  class="title" title="保利别墅205平4房单价37000元起" name="1">
-                <div class="peopletimer">
-                    <span class="people">16人看过</span>
-                    <span class="timer">2018/09/07</span>
-                </div>
-            </van-collapse-item>
-        </van-collapse>
-    </div>
-</template>
-
-<script>
-export default {
-    name:'CorrelationDynamics',
-    data() {
-        return {
-        activeName: '1'
-        };
-  }
-}
-</script>
-
-<style lang="postcss" scoped>
-.dynamics{
-    width: 100%;
-    height: auto;
-    background-color: rgba(255,255,255,1);
-
-    .line{
-        width:90%;
-        border: 0.5px solid #EFEFEF;
-        }
-
-    .dynamicstitle{
-        padding: 15px 0 10px 20px;
-
-        .titlecharacters{
-            font-size:18px;
-            font-family:PingFangSC-Regular;
-            font-weight:400;
-            color:rgba(37,38,42,1);
-            line-height:25px;
-        }
-    }
-        .title{
-            font-size:16px;
-            font-family:PingFangSC-Regular;
-            font-weight:400;
-            color:rgba(37,38,42,1);
-            line-height:22px;
-
-            .peopletimer{
-                font-size:12px;
-                font-family:PingFangSC-Regular;
-                font-weight:400;
-                color:rgba(128,128,128,1);
-                line-height:17px;
-
-                .people{
-                    padding-right: 20px
-                }
-            }
-        }
-}
-</style>
-
-
+<template>
+    <div class="dynamics">
+        <div class="dynamicstitle">
+            <span class="titlecharacters">相关动态</span>
+        </div>
+        <van-collapse v-model="activeName" accordion>
+            <van-collapse-item  class="title" title="保利别墅205平4房单价37000元起" name="1">
+                <div class="peopletimer">
+                    <span class="people">16人看过</span>
+                    <span class="timer">2018/09/07</span>
+                </div>
+            </van-collapse-item>
+        </van-collapse>
+    </div>
+</template>
+
+<script>
+export default {
+    name:'CorrelationDynamics',
+    data() {
+        return {
+        activeName: '1'
+        };
+  }
+}
+</script>
+<style scoped>
+.van-cell:not(:last-child)::after{
+    right:15px!important;
+}
+</style>
+
+
+<style lang="postcss" scoped>
+.dynamics{
+    width: 100%;
+    height: auto;
+    background-color: rgba(255,255,255,1);
+
+    .dynamicstitle{
+        padding: 15px 0 10px 20px;
+
+        .titlecharacters{
+            font-size:18px;
+            font-family:PingFangSC-Regular;
+            font-weight:400;
+            color:rgba(37,38,42,1);
+            line-height:25px;
+        }
+    }
+        .title{
+            font-size:16px;
+            font-family:PingFangSC-Regular;
+            font-weight:400;
+            color:rgba(37,38,42,1);
+            line-height:22px;
+
+            .peopletimer{
+                font-size:12px;
+                font-family:PingFangSC-Regular;
+                font-weight:400;
+                color:rgba(128,128,128,1);
+                line-height:17px;
+
+                .people{
+                    padding-right: 20px
+                }
+            }
+        }
+}
+</style>
+
+

src/pages/building/components/toasebox.vue → src/pages/reservation/components/toasebox.vue

@@ -1,30 +1,30 @@
-<template>
-    <div class="van-dialog">
-        <div class="van-dialog__header">联系电话</div>
-        <div class="van-dialog__content">
-            <div class="van-dialog__message van-dialog__message--has-title">400-7689-9756</div>
-        </div>
-        <div class="van-hairline--top van-dialog__footer van-dialog__footer--buttons">
-            <button class="van-button van-button--default van-button--large van-dialog__cancel">
-                <span class="van-button__text">取消</span>
-            </button>
-            <button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left">
-                <span class="van-button__text">拨打</span>
-            </button>
-        </div>
-    </div>
-</template>
-
-<script>
-    export default {
-        name:'ToaseBox',
-    }
-</script>
-
-<style lang="postcss" scoped>
-.van-dialog{
-  z-index: 2038;
-  display: none;
-}
-</style>
-
+<template>
+    <div class="van-dialog">
+        <div class="van-dialog__header">联系电话</div>
+        <div class="van-dialog__content">
+            <div class="van-dialog__message van-dialog__message--has-title">400-7689-9756</div>
+        </div>
+        <div class="van-hairline--top van-dialog__footer van-dialog__footer--buttons">
+            <button class="van-button van-button--default van-button--large van-dialog__cancel">
+                <span class="van-button__text">取消</span>
+            </button>
+            <button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left">
+                <span class="van-button__text">拨打</span>
+            </button>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name:'ToaseBox',
+    }
+</script>
+
+<style lang="postcss" scoped>
+.van-dialog{
+  z-index: 2038;
+  display: none;
+}
+</style>
+

src/pages/reservation/lookhouse.vue

@@ -11,22 +11,21 @@
               </van-popup>
           </van-cell>
           <van-cell class="field_name">楼盘地址：</van-cell>
-          <van-switch-cell v-model="checked" title="马上去" />
-          <van-cell class="field_name" @click="showDatePicker()">预约时间：
-            <van-popup v-model="show" position="bottom" :overlay="false">
-              <van-datetime-picker v-model="currentDate" type="datetime" :min-date="minDate" :max-date="maxDate"/>
-            </van-popup>
-          </van-cell>
+          <van-switch-cell v-model="checked" @click="onInput" title="马上去" />
+          <van-field class="field_name" @click="showDatePicker()" label="预约时间：" />
+          <van-popup v-model="show" position="bottom" :overlay="false">
+            <van-datetime-picker v-model="currentDate" type="datetime" :min-date="minDate" :max-date="maxDate"/>
+          </van-popup>
           <van-field class="field_name"  label="手机号码：" />
           <van-field class="field_name"  label="看房人数："/> 
+          <div class="information">
+            <span class="remarks">备注信息：</span>
+            <div class="input_content">
+                <textarea  id="textArea" class="content_txt" maxlength="100" @input = "descInput" v-model="desc" placeholder="例如:偏好、预算、要求等" onfocus="this.placeholder=''" onblur="this.placeholder='例如:偏好、预算、要求等'"></textarea>
+                <span class="number"><span  id="textNum" style="color:#FB6B2F">{{remnant}}</span><span>/100</span></span>
+            </div>
+          </div> 
         </van-cell-group>
-        <div class="information">
-          <span class="remarks">备注信息：</span>
-          <div class="input_content">
-              <textarea  id="textArea" class="content_txt" maxlength="100" placeholder="例如:偏好、预算、要求等" onfocus="this.placeholder=''" onblur="this.placeholder='例如:偏好、预算、要求等'"></textarea>
-              <span class="number"><span  id="textNum" style="color:#FB6B2F">0</span><span>/100</span></span>
-          </div>
-        </div> 
     </div>
     <div class="btn">
       <van-button size="large">提交</van-button>
@@ -35,9 +34,11 @@
 </template>
 
 <script>
+import ToaseBox from './components/toasebox.vue'
 export default {
   components: {
-    "vue-headful": () => import("vue-headful")
+    "vue-headful": () => import("vue-headful"),
+    "ToaseBox":ToaseBox
   },
   data() {
     return {
@@ -48,24 +49,47 @@ export default {
       maxHour: 20,
       minDate: new Date(),
       maxDate: new Date(2080, 10, 1),
-      currentDate: new Date()
+      currentDate: new Date(),
+      remnant:0 //输入数
+
     };
   },
+  //  mounted() {
+  //   this.$dialog.alert({
+  //     message: '弹窗内容'
+  //   });
+  // },
   methods: {
     showDatePicker() {
       this.show = true;
     },
+
     showName (){
       this.inside = true;
+    },
+
+    //计算输入数
+    descInput(){
+      const txtVal = this.desc.length;
+      this.remnant = txtVal;
     }
   }
 };
 </script>
 
-<style>
+<style scoped>
 .van-picker__frame{
   display: none;
 }
+
+.van-cell:not(:last-child)::after{
+    right:15px!important;
+}
+
+.van-hairline--top-bottom::after{
+  border-width:0;
+}
+
 </style>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
@@ -97,7 +121,7 @@ export default {
       }
       .input_content {
         width: 90%;
-        height: 110px;
+        height: 125px;
         position: relative;
         margin-left: 15px;