xuqiang 4 år sedan
förälder
incheckning
c319bcb05c

+ 2 - 2
src/main.js

@@ -33,14 +33,14 @@ export default {
                 {
                     pagePath: 'pages/hello',
                     text: '房间信息',
-                    iconPath: 'native/tabbar/tabbar_icon_01@3x.png',
+                    iconPath: 'native/tabbar/tabbar_icon_01@3x (1).png',
                     selectedIconPath: 'native/tabbar/tabbar_icon_01@3x.png'
                 },
                 {
                     pagePath: 'pages/my',
                     text: '我的',
                     iconPath: 'native/tabbar/tabbar_icon_02@3x.png',
-                    selectedIconPath: 'native/tabbar/tabbar_icon_02@3x.png'
+                    selectedIconPath: 'native/tabbar/tabbar_icon_02@3x (1).png'
                 }
             ]
         },

BIN
src/native/tabbar/info_img_gerenyue@3x.png


BIN
src/native/tabbar/tabbar_icon_01@3x (1).png


BIN
src/native/tabbar/tabbar_icon_02@3x (1).png


BIN
src/native/tabbar/wode_icon_baoxiu@3x.png


BIN
src/native/tabbar/wode_icon_dasao@3x.png


BIN
src/native/tabbar/wode_icon_shouming@3x.png


BIN
src/native/tabbar/wode_icon_tousu@3x.png


+ 154 - 2
src/pages/my.vue

@@ -15,6 +15,42 @@
                 <img class="setting" src="../native/tabbar/icon_bianji@3x.png" alt="" />
             </div>
         </div>
+        <div class="background">
+            <img class="img" src="../native/tabbar/info_img_gerenyue@3x.png" alt="" />
+            <div class="money">
+                <div>
+                    <div class="money1">465.26</div>
+                    <div class="text1">团队总预存余额</div>
+                </div>
+                <div class="btn">
+                    <div class="btn1" @click="Tixian">提现</div>
+                    <div class="btn2">充值</div>
+                </div>
+                <div class="deposit">房租押金 <span>¥1500</span> 去缴费</div>
+            </div>
+        </div>
+        <div class="content1">
+            <div class="title1">我的服务</div>
+            <div class="border"></div>
+            <div class="box">
+                <div class="div">
+                    <img class="tit-img" src="../native/tabbar/wode_icon_baoxiu@3x.png" alt="" />
+                    <div class="text">保修申请</div>
+                </div>
+                <div class="div">
+                    <img class="tit-img" src="../native/tabbar/wode_icon_dasao@3x.png" alt="" />
+                    <div class="text">打扫申请</div>
+                </div>
+                <div class="div">
+                    <img class="tit-img" src="../native/tabbar/wode_icon_tousu@3x.png" alt="" />
+                    <div class="text">投诉/建议</div>
+                </div>
+                <div class="div">
+                    <img class="tit-img" src="../native/tabbar/wode_icon_shouming@3x.png" alt="" />
+                    <div class="text">帮助说明</div>
+                </div>
+            </div>
+        </div>
     </div>
 </template>
 <script>
@@ -34,12 +70,13 @@ export default {
     }
 };
 </script>
-<style lang="less">
+<style lang="less" scoped>
 .container {
+    background: #f5f7fa;
+    height: 100vh;
     .top {
         display: flex;
         align-items: center;
-        margin-bottom: 28px;
         .avatar {
             width: 80px;
             height: 80px;
@@ -72,5 +109,120 @@ export default {
             }
         }
     }
+    .border {
+        height: 1px;
+        background: #f5f7fa;
+        margin: 16px 0;
+    }
+    .background {
+        position: relative;
+        display: flex;
+        margin: 28px 20px 20px;
+        .img {
+            height: 128px;
+            width: 100%;
+        }
+        .money {
+            position: absolute;
+            display: flex;
+            margin: 16px 0 0 16px;
+            .money1 {
+                font-size: 26px;
+                font-family: DIN-Bold, DIN;
+                font-weight: bold;
+                color: #ff7f1f;
+                line-height: 31px;
+            }
+            .text1 {
+                font-size: 13px;
+                font-family: PingFangSC-Regular, PingFang SC;
+                font-weight: normal;
+                color: #ffffff;
+                line-height: 18px;
+            }
+            .btn {
+                display: flex;
+                align-items: center;
+                .btn1 {
+                    width: 72px;
+                    height: 26px;
+                    background: rgba(255, 255, 255, 0.33);
+                    border-radius: 13px;
+                    border: 1px solid #ffffff;
+                    font-weight: bold;
+                    line-height: 26px;
+                    text-align: center;
+                    color: #ffffff;
+                    margin: 0 20px 0 48px;
+                }
+                .btn2 {
+                    width: 72px;
+                    height: 26px;
+                    background: #ffffff;
+                    font-weight: bold;
+                    line-height: 26px;
+                    text-align: center;
+                    color: #5d7dff;
+                    border-radius: 13px;
+                }
+            }
+        }
+        .deposit {
+            position: absolute;
+            top: 80px;
+            left: 80px;
+            font-size: 13px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: bold;
+            color: #ffffff;
+            line-height: 18px;
+        }
+        span {
+            font-size: 16px;
+            font-family: DIN-Bold, DIN;
+            font-weight: bold;
+            color: #ffffff;
+            line-height: 19px;
+            margin-top: 4px;
+        }
+    }
+    .content1 {
+        margin: 20px;
+        padding: 20px 12px;
+        background: #ffffff;
+        box-shadow: 0px 2px 4px 0px rgba(1, 168, 91, 0.04);
+        border-radius: 12px;
+        .title1 {
+            font-size: 18px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: bold;
+            color: #000000;
+            line-height: 25px;
+        }
+        .box {
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            flex-wrap: wrap;
+            margin: 0 14px;
+            .div {
+                margin-right: 27px;
+                text-align: center;
+                .tit-img {
+                    width: 36px;
+                    height: 36px;
+                    margin-bottom: 6px;
+                }
+                .text {
+                    font-size: 14px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: normal;
+                    color: #000000;
+                    line-height: 20px;
+                    margin-bottom: 25px;
+                }
+            }
+        }
+    }
 }
 </style>

+ 1 - 1
src/styles/common.less

@@ -1,4 +1,4 @@
-@prim: #ff6c00;
+@prim: #00BA64;
 @success: #07c160;
 @danger: #ff6c00;
 @warn: #ff976a;

+ 1 - 1
src/styles/vanIndex.less

@@ -1,4 +1,4 @@
-@prim: #ff6c00;
+@prim: #00BA64;
 
 .van-button {
     --button-primary-background-color: @prim;