add tid1509 style

src/pages.json

@@ -887,6 +887,24 @@
 					"style" : {
 						"navigationBarTitleText": "消息订阅"
 					}
+				},
+				{
+					"path": "pages/manage/methods",
+					"style" : {
+						"navigationBarTitleText": "添加账号"
+					}
+				},
+				{
+					"path": "pages/manage/add",
+					"style" : {
+						"navigationBarTitleText": "手动添加账号"
+					}
+				},
+				{
+					"path": "pages/manage/apply",
+					"style" : {
+						"navigationBarTitleText": "手动添加账号"
+					}
 				}
 			]
 		}

src/subpackage/account/components/fixed_modal.vue

@@ -2,11 +2,12 @@
     <view class="fixed-mask" v-show="show">
         <view class="fm-content">
             <image 
+                v-if="close"
                 class="fc-close" 
                 @click="$emit('click:close')" 
                 mode="aspect" 
             ></image>
-            <view class="fc-title">{{ title }}</view>
+            <view v-if="title" class="fc-title">{{ title }}</view>
             <slot></slot>
         </view>
     </view>
@@ -15,9 +16,13 @@
 <script>
 export default {
     props: {
+        close: {
+            type: Boolean,
+            default: true
+        },
         title: {
             type: String,
-            default: '提示'
+            default: ''
         },
         show: {
             type: Boolean,

src/subpackage/account/pages/manage/add.vue

@@ -1,11 +1,15 @@
 <template>
-    <view>
-        
+    <view class="manage-add">
+        <account-form></account-form>
     </view>
 </template>
 
 <script>
+import account_form from "./modules/account_form.vue";
 export default {
+    components: {
+        'account-form': account_form
+    },
     data(){
         return {
             
@@ -21,5 +25,14 @@ export default {
 </script>
 
 <style lang="scss">
+page{
+    background: #fff;
+}
+.manage-add{
+    padding-top: 20upx;
+}
+.from-input{
+    padding: 0 56upx;
     
+}
 </style>

src/subpackage/account/pages/manage/apply.vue

@@ -1,11 +1,26 @@
 <template>
-    <view>
+    <view class="manage-apply">
+        <stadium-info></stadium-info>
+        <view class="ma-border"></view>
+        <account-form></account-form>
+        <fixed-button>提交</fixed-button>
         
+        <success-modal></success-modal>
     </view>
 </template>
 
 <script>
+import stadium_info from "./modules/stadium_info.vue";
+import account_form from "./modules/account_form.vue";
+import fixedButton from "../../components/fixed_button.vue";
+import success_modal from "./modules/apply/success_modal.vue";
 export default {
+    components: {
+        'stadium-info': stadium_info,
+        'account-form': account_form,
+        'fixed-button': fixedButton,
+        'success-modal': success_modal
+    },
     data(){
         return {
             
@@ -21,5 +36,14 @@ export default {
 </script>
 
 <style lang="scss">
-
+page{
+    background: #fff;
+}
+.manage-apply{
+    .ma-border{
+        margin-bottom: 16upx;
+        height: 24upx;
+        background: #f2f2f7;
+    }
+}
 </style>

src/subpackage/account/pages/manage/methods.vue

@@ -1,11 +1,32 @@
 <template>
-    <view>
-        
+    <view class="manage-methods">
+        <view class="mm-box">
+            <stadium-info></stadium-info>
+        </view>
+        <view class="mm-box">
+            <method-bar></method-bar>
+            <view class="mm-code">
+                <image class="mc-img"></image>
+                <view class="mc-txt">欧轩智能商家助手</view>
+            </view>
+        </view>
+        <view class="mm-box">
+            <method-bar></method-bar>
+        </view>
+        <view class="mm-box">
+            <method-bar></method-bar>
+        </view>
     </view>
 </template>
 
 <script>
+import stadium_info from "./modules/stadium_info.vue";
+import method_bar from "./modules/methods/method_bar.vue";
 export default {
+    components: {
+        'stadium-info': stadium_info,
+        'method-bar': method_bar
+    },
     data(){
         return {
             
@@ -21,5 +42,35 @@ export default {
 </script>
 
 <style lang="scss">
+page{
+    background: $mColor;
+}
+.manage-methods{
+    padding: 24upx;
+}
+.mm-box{
+    border-radius: 10upx;
+    overflow: hidden;
+    background: #fff;
+    &+.mm-box{
+        margin-top: 24upx;
+    }
+}
+
+.mm-code{
+    padding-bottom: 44upx;
+    .mc-img{
+        display: block;
+        margin: 0 auto;
+        width: 296upx;
+        height: 296upx;
+        background: skyblue;
+    }
+    .mc-txt{
+        margin-top: 20upx;
+        text-align: center;
+        @include flcw(24upx, 34upx, #9C9C9F);
+    }
+}
 
 </style>

src/subpackage/account/pages/manage/modules/account_form.vue

@@ -0,0 +1,58 @@
+<template>
+    <view class="account-form">
+        <input-bar
+            star
+            label="登录账号"
+            placeholder="请输入登录账号"
+            tip="建议手机号，账号需唯一，提交后不可修改"
+        ></input-bar>
+        <input-bar
+            star
+            label="密码"
+            type="password"
+            placeholder="请输入密码"
+        ></input-bar>
+        <input-bar
+            star
+            label="确认密码"
+            type="password"
+            placeholder="请确认密码"
+        ></input-bar>
+        <input-bar
+            star
+            label="姓名"
+            placeholder="请输入姓名"
+        ></input-bar>
+        <input-bar
+            label="手机号码"
+            type="number"
+            placeholder="请输入手机号码"
+        ></input-bar>
+    </view>
+</template>
+
+<script>
+import input_bar from "./input_bar.vue";
+export default {
+    components: {
+        'input-bar': input_bar
+    },
+    data(){
+        return {
+            
+        }
+    },
+    onLoad(){
+        
+    },
+    methods: {
+        
+    }
+}
+</script>
+
+<style lang="scss">
+    .account-form{
+        padding: 0 56upx;
+    }
+</style>

src/subpackage/account/pages/manage/modules/apply/success_modal.vue

@@ -0,0 +1,48 @@
+<template>
+    <fixed-modal>
+        <view class="success-modal">
+            <image class="sm-icon"></image>
+            <view class="sm-txt">账号创建成功</view>
+            <modal-button green>确认修改</modal-button>
+        </view>
+    </fixed-modal>
+</template>
+
+<script>
+import fixedModal from "../../../../components/fixed_modal.vue";
+import modalButton from "../../../../components/modal_button.vue";
+export default {
+    components: {
+        'fixed-modal': fixedModal,
+        'modal-button': modalButton
+    },
+    data(){
+        return {
+            
+        }
+    },
+    onLoad(){
+        
+    },
+    methods: {
+        
+    }
+}
+</script>
+
+<style lang="scss">
+    .success-modal{
+        .sm-icon{
+            display: block;
+            margin: 0 auto;
+            width: 100upx;
+            height: 100upx;
+            background: skyblue;
+        }
+        .sm-txt{
+            margin-top: 32upx;
+            text-align: center;
+            @include flcw(36upx, 50upx, #1A1A1A);
+        }
+    }
+</style>

src/subpackage/account/pages/manage/modules/input_bar.vue

@@ -0,0 +1,80 @@
+<template>
+    <view class="input-bar">
+        <view class="ib-line">
+            <view class="il-label">
+                <text class="il-star" v-if="star">*</text>{{ label }}
+            </view>
+            <input 
+                class="il-input" 
+                :type="type" 
+                :placeholder="placeholder" 
+                @input="$emit('input', $event.target.value)"
+                :value="value"
+            />
+        </view>
+        <view class="il-tip" v-if="tip">{{ tip }}</view>
+    </view>
+</template>
+
+<script>
+export default {
+    props:{
+        star: {
+            type: Boolean,
+            default: false
+        },
+        label: {
+            type: String,
+            default: ''
+        },
+        type: {
+            type: String,
+            default: 'text'
+        },
+        placeholder: {
+            type: String,
+            default: ''
+        },
+        tip: {
+            type: String,
+            default: ''
+        },
+        value: {
+            type: String,
+            default: ''
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    .input-bar{
+        padding: 20upx 0;
+        .ib-line{
+            @include ctf(space-between);
+            .il-label{
+                @include flcw(28upx, 40upx, #1A1A1A);
+                .il-star{
+                    color: #EA5061
+                }
+            }
+            .il-input{
+                box-sizing: border-box;
+                flex-shrink: 0;
+                width: 478upx;
+                height: 92upx;
+                padding: 0 24upx;
+                border-radius: 10upx;
+                background: #F2F2F7;
+                @include flcw(28upx, 40upx, #1a1a1a);
+            }
+        }
+        .il-tip{
+            margin-top: 20upx;
+            margin-left: auto;
+            margin-right: 0;
+            width: 478upx;
+            @include flcw(24upx, 34upx, #EA5061);
+        }
+    }
+</style>

src/subpackage/account/pages/manage/modules/methods/method_bar.vue

@@ -0,0 +1,50 @@
+<template>
+    <view class="method-bar">
+        <image class="mb-icon"></image>
+        <view class="mb-content">
+            <view class="mc-desc">邀请微信朋友申请加入</view>
+            <view class="mc-tip">申请后，需管理员审核通过才可使用账号</view>
+        </view>
+        <image class="mb-arrow"></image>
+    </view>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style lang="scss">
+.method-bar{
+    padding: 38upx 24upx;
+    @include ctf(space-between);
+    .mb-icon{
+        align-self: flex-start;
+        flex-shrink: 0;
+        margin-right: 20upx;
+        width: 52upx;
+        height: 52upx;
+        background: skyblue;
+    }
+    .mb-content{
+        flex-grow: 1;
+        .mc-desc{
+            @include flcw(32upx, 44upx, #1A1A1A);
+            @include tHide;
+        }
+        .mc-tip{
+            margin-top: 8upx;
+            @include flcw(24upx, 34upx, #9C9C9F);
+            @include tHide;
+        }
+    }
+    .mb-arrow{
+        flex-shrink: 0;
+        margin-left: 20upx;
+        width: 28upx;
+        height: 28upx;
+        background: skyblue;
+    }
+}
+</style>

src/subpackage/account/pages/manage/modules/stadium_info.vue

@@ -0,0 +1,29 @@
+<template>
+    <view class="stadium-info">
+        <view class="si-line">
+            <text class="sl-label">品牌名称：</text>欧轩智能场馆SaaS系统
+        </view>
+        <view class="si-line">
+            <text class="sl-label">品牌ID：</text>45
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style lang="scss">
+.stadium-info{
+    padding: 34upx 32upx;
+    .si-line{
+        @include flcw(32upx, 40upx, #1A1A1A, 500);
+        @include tHide;
+        .sl-label{
+            @include flcw(28upx, 40upx, #1A1A1A, 400);
+        }
+    }
+}
+</style>

src/subpackage/account/pages/message/info.vue

@@ -33,6 +33,8 @@
             </template>
         </info-container>
         <fixed-button>修改消息订阅</fixed-button>
+
+        <bind-modal></bind-modal>
     </view>
 </template>
 
@@ -41,14 +43,14 @@ import infoContainer from '../../components/info_container.vue';
 import user_info from "../../components/user_info.vue";
 import fixedButton from "../../components/fixed_button.vue";
 import permission_item from '../../components/permission_item.vue';
+import bind_modal from "./modules/info/bind_modal.vue";
 export default {
     components: {
         'info-container': infoContainer,
         'user-info': user_info,
         'fixed-button': fixedButton,
         'permission-item': permission_item,
-        
-
+        'bind-modal': bind_modal
     },
     data(){
         return {

src/subpackage/account/pages/message/modules/info/bind_modal.vue

@@ -0,0 +1,66 @@
+<template>
+    <fixed-modal title="绑定">
+        <view class="bind-modal">
+            <image class="bm-code-img"></image>
+            <view class="bm-tip">截图转发/点击放大图片后长按识别绑定账号，并关注“欧轩智能场馆”公众号接收消息</view>
+            <view class="bm-btn-frame">
+                <view class="bbf-tip">本人微信号绑定的可点击按钮去绑定</view>
+                <modal-button green>确认修改</modal-button>
+            </view>
+        </view>
+    </fixed-modal>
+    
+</template>
+
+<script>
+import fixedModal from "../../../../components/fixed_modal.vue";
+import modalButton from "../../../../components/modal_button.vue";
+export default {
+    components: {
+        'fixed-modal': fixedModal,
+        'modal-button': modalButton
+    },
+    data(){
+        return {
+            
+        }
+    },
+    onLoad(){
+        
+    },
+    methods: {
+        
+    }
+}
+</script>
+
+<style lang="scss">
+.bind-modal{
+    .bm-code-img{
+        display: block;
+        margin: 40upx auto 0upx;
+        width: 296upx;
+        height: 296upx;
+        background: skyblue;
+    }
+    .bm-tip{
+        margin-top: 12upx;
+        padding: 0 68upx;
+        text-align: center;
+        @include flcw(24upx, 40upx, #1A1A1A);
+    }
+    .bm-btn-frame{
+        margin: 72upx auto 0upx;
+        padding-top: 44upx;
+        width: 518upx;
+        height: 272upx;
+        border-radius: 10upx;
+        background: #F2F2F7;
+        .bbf-tip{
+            margin-bottom: 40upx;
+            text-align: center;
+            @include flcw(28upx, 42upx, #1A1A1A, 500);
+        }
+    }
+}
+</style>