add tid1509 style

src/pages.json

@@ -869,6 +869,12 @@
 					"style" : {
 						"navigationBarTitleText": "账号权限"
 					}
+				},
+				{
+					"path": "pages/permission/edit",
+					"style" : {
+						"navigationBarTitleText": "账号权限"
+					}
 				}
 			]
 		}

src/subpackage/account/components/fixed_button.vue

@@ -0,0 +1,36 @@
+<template>
+    <view class="fixed-button">
+        <view class="fb-box">
+            <view class="bottom-btn">
+                <slot>确认</slot>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style lang="scss">
+.fixed-button{
+    @include isPd(132upx);
+}
+.fb-box{
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    padding: 10upx 24upx;
+    @include isPd(10upx);
+    .bottom-btn{
+        height: 112upx;
+        border-radius: 10upx;
+        background: $mColor;
+        text-align: center;
+        @include flcw(32upx, 112upx, #fff, 500);
+    }
+}
+</style>

src/subpackage/account/components/fixed_modal.vue

@@ -0,0 +1,63 @@
+<template>
+    <view class="fixed-mask" v-show="show">
+        <view class="fm-content">
+            <image 
+                class="fc-close" 
+                @click="$emit('click:close')" 
+                mode="aspect" 
+            ></image>
+            <view class="fc-title">{{ title }}</view>
+            <slot></slot>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    props: {
+        title: {
+            type: String,
+            default: '提示'
+        },
+        show: {
+            type: Boolean,
+            default: true
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    .fixed-mask{
+        position: fixed;
+        left: 0;
+        top: 0;
+        bottom: 0;
+        right: 0;
+        background: rgba($color: #000000, $alpha: .5);
+        z-index: 10;
+        .fm-content{
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            transform: translate(-50%, -50%);
+            padding-top: 80upx;
+            padding-bottom: 60upx;
+            width: 620upx;
+            border-radius: 10upx;
+            background: #fff;
+            .fc-close{
+                position: absolute;
+                right: 30upx;
+                top: 30upx;
+                width: 34upx;
+                height: 34upx;
+                background: skyblue;
+            }
+            .fc-title{
+                text-align: center;
+                @include flcw(32upx, 44upx, #1A1A1A, 500);
+            }
+        }
+    }
+</style>

src/subpackage/account/components/info_title.vue

@@ -24,6 +24,7 @@ export default {
         padding: 10upx 20upx 0upx;
         height: 116upx;
         border-bottom: 2upx solid #D8D8D8;
+        overflow: hidden;
         @include ctf;
         .it-name{
             flex-shrink: 0;
@@ -32,8 +33,6 @@ export default {
         }
         .it-right{
             flex-grow: 1;
-            height: 100%;
-            background: skyblue;
         }
     }
 </style>

src/subpackage/account/components/modal_button.vue

@@ -0,0 +1,32 @@
+<template>
+    <view class="modal-button" :class="{ 'green': green }" @click="$emit('click')">
+        <slot>确定</slot>
+    </view>
+</template>
+
+<script>
+export default {
+    props: {
+        green: {
+            type: Boolean,
+            default: false
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    .modal-button{
+        margin: 0 auto;
+        width: 240upx;
+        height: 88upx;
+        border: 2upx solid $mColor;
+        border-radius: 10upx;
+        text-align: center;
+        @include flcw($color: $mColor, $height: 84upx);
+        &.green{
+            background: $mColor;
+            color: #fff;
+        }
+    }
+</style>

src/subpackage/account/pages/permission/modules/info/user.vue → src/subpackage/account/components/user_info.vue

@@ -3,20 +3,23 @@
         <view class="iu-top">
             <view class="it-left">
                 <view class="il-name">周小舞</view>
-                <image class="il-edit"></image>
+                <image class="il-edit" v-if="edit"></image>
             </view>
-            <image class="it-delete"></image>
+            <image class="it-delete" v-if="edit"></image>
         </view>
         <view class="iu-box">
             <view class="iu-line">
                 <text class="il-txt">登录账号：</text> liuhuo2524
             </view>
-            <view class="iu-line">
-                <text class="il-txt">密码：</text> <text class="il-link">修改密码</text>
-            </view>
-            <view class="iu-line">
-                <text class="il-txt">创建时间：</text> 2024-12-09 11:21:40
-            </view>
+            <block v-if="edit">
+                <view class="iu-line">
+                    <text class="il-txt">密码：</text> <text class="il-link">修改密码</text>
+                </view>
+                <view class="iu-line">
+                    <text class="il-txt">创建时间：</text> 2024-12-09 11:21:40
+                </view>
+            </block>
+            
         </view>
         
     </view>
@@ -24,7 +27,12 @@
 
 <script>
 export default {
-
+    props: {
+        edit: {
+            type: Boolean,
+            default: false
+        }
+    }
 }
 </script>
 

src/subpackage/account/pages/permission/edit.vue

@@ -1,11 +1,18 @@
 <template>
-    <view>
-        
+    <view class="permission-edit">
+        <user-info></user-info>
+        <select-container></select-container>
     </view>
 </template>
 
 <script>
+import user_info from "../../components/user_info.vue";
+import select_container from "./modules/edit/select_container.vue";
 export default {
+    components: {
+        'user-info': user_info,
+        'select-container': select_container
+    },
     data(){
         return {
             
@@ -21,5 +28,7 @@ export default {
 </script>
 
 <style lang="scss">
-
+    .permission-edit{
+        padding: 24upx;
+    }
 </style>

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

@@ -1,24 +1,40 @@
 <template>
     <view class="permission-info">
-        <info-user></info-user>
-        <info-container title="后台权限">
-            <template v-slot:title-right>8897</template>
-            <template v-slot:content>9987</template>
-        </info-container>
+        <user-info edit></user-info>
+        <admin-permission></admin-permission>
+        <min-permission></min-permission>
+        <cashier-permission></cashier-permission>
+        <stadium-permission></stadium-permission>
+        <fixed-button>修改权限</fixed-button>
+        <!-- <edit-password></edit-password> -->
+        <!-- <edit-account></edit-account> -->
     </view>
 </template>
 
 <script>
-import infoUser from "./modules/info/user.vue";
-import infoContainer from "../../components/info_container.vue";
+import user_info from "../../components/user_info.vue";
+import adminPermission from "./modules/info/admin_permission.vue";
+import minPermission from "./modules/info/min_permission.vue";
+import cashierPermission from "./modules/info/cashier_permission.vue";
+import stadiumPermission from "./modules/info/stadium_permission.vue";
+import fixedButton from "../../components/fixed_button.vue";
+import editPassword from "./modules/info/edit_password.vue";
+import edit_account from "./modules/info/edit_account.vue";
+
 export default {
     components: {
-        'info-user': infoUser,
-        'info-container': infoContainer
+        'admin-permission': adminPermission,
+        'min-permission': minPermission,
+        'cashier-permission': cashierPermission,
+        'stadium-permission': stadiumPermission,
+        'fixed-button': fixedButton,
+        'edit-password': editPassword,
+        'edit-account': edit_account,
+        'user-info': user_info
     },
     data(){
         return {
-            
+             
         }
     },
     onLoad(){

src/subpackage/account/pages/permission/modules/edit/select_container.vue

@@ -0,0 +1,45 @@
+<template>
+    <info-container :title="title">
+        <template v-slot:title-right>
+            <view class="sc-title-right">
+                <view class="str-txt">全选</view>
+                <image class="str-img"></image>
+            </view>
+        </template>
+        <template v-slot:content>
+            <slot></slot>
+        </template>
+    </info-container>
+</template>
+
+<script>
+import infoContainer from '../../../../components/info_container.vue';
+export default {
+    components: {
+        'info-container': infoContainer
+    },
+    props: {
+        title: {
+            type: String,
+            default: 'title'
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+    .sc-title-right{
+        @include ctf(flex-end);
+        .str-txt{
+            flex-shrink: 0;
+            @include flcw(24upx, 34upx, #1A1A1A);
+        }
+        .str-img{
+            margin-left: 18upx;
+            flex-shrink: 0;
+            width: 32upx;
+            height: 32upx;
+            background: skyblue;
+        }
+    }
+</style>

src/subpackage/account/pages/permission/modules/info/admin_permission.vue

@@ -0,0 +1,37 @@
+<template>
+    <view class="admin-permission">
+        <info-container title="后台权限">
+            <template v-slot:title-right>
+                <view class="ap-title-right">
+                    <view class="atr-name">修改需前往后台定义权限组</view>
+                    <switch color="#009874" style="transform:scale(0.7)"></switch>
+                </view>
+            </template>
+            <template v-slot:content>
+                <view class="ap-content">权限级别名称：超级管理员</view>
+            </template>
+        </info-container>
+    </view>
+</template>
+
+<script>
+import infoContainer from '../../../../components/info_container.vue';
+export default {
+    components: {
+        'info-container': infoContainer
+    },
+}
+</script>
+
+<style lang="scss">
+    .ap-title-right{
+        @include ctf(space-between);
+        .atr-name{
+            @include flcw(24upx, 34upx, #9C9C9F);
+        }
+    }
+    .ap-content{
+        padding: 0upx 20upx;
+        @include flcw(28upx, 40 px, #1A1A1A);
+    }
+</style>

src/subpackage/account/pages/permission/modules/info/cashier_permission.vue

@@ -0,0 +1,43 @@
+<template>
+    <view class="min-permission">
+        <info-container title="收银系统权限">
+            <template v-slot:content>
+                <view class="mp-content">
+                    <view class="mc-item" v-for="i in 3" :key="i">
+                        <permission-item :active="i%3 === 0"></permission-item>
+                    </view>
+                </view>
+            </template>
+        </info-container>
+    </view>
+</template>
+
+<script>
+import infoContainer from '../../../../components/info_container.vue';
+import permissionItem from './permission_item.vue';
+export default {
+    components: {
+        'info-container': infoContainer,
+        'permission-item': permissionItem
+    },
+}
+</script>
+
+<style lang="scss">
+.min-permission{
+    .mp-content{
+        padding: 0 20upx;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        .mc-item{
+            flex-shrink: 0;
+            flex-grow: 0;
+            width: 188upx;
+            &:nth-child(n + 4){
+                margin-top: 20upx;
+            }
+        }
+    }
+}
+</style>

src/subpackage/account/pages/permission/modules/info/edit_account.vue

@@ -0,0 +1,88 @@
+<template>
+    <fixed-modal title="修改账号信息">
+        <view class="edit-account">
+            <view class="ea-num">登录账号：liuhuo2524</view>
+            <view class="ea-tip">账号具有唯一性，不支持更改。</view>
+            <view class="edit-ipt">
+                <view class="ep-item">
+                    <view class="ei-label"><text class="el-star">*</text>姓名</view>
+                    <input class="ei-input" type="password" placeholder="请输入" />
+                </view>
+                <view class="ep-item">
+                    <view class="ei-label">手机号码</view>
+                    <input class="ei-input" type="password" placeholder="请输入手机号码" />
+                </view>
+            </view>
+        </view>
+        <modal-button green>确认修改</modal-button>
+    </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">
+    .edit-account{
+        padding-top: 56upx;
+        padding-bottom: 60upx;
+        .ea-num{
+            padding: 0 40upx;
+            @include flcw(28upx, 40upx, #1A1A1A);
+            @include tHide;
+        }
+        .ea-tip{
+            padding: 0 40upx;
+            margin-top: 20upx;
+            @include flcw(24upx, 40upx, #EA5061);
+        }
+        .edit-ipt{
+            margin-top: 46upx;
+        }
+        .ep-item{
+            padding:  0 40upx;
+            @include ctf(space-between);
+            .ei-label{
+                @include flcw(28upx, 40upx, #1A1A1A);
+                .el-star{
+                    margin-right: 10upx;
+                    color: #EA5061;
+                }
+            }
+            .ei-input{
+                flex-shrink: 0;
+                flex-grow: 0;
+                width: 406upx;
+                box-sizing: border-box;
+                margin-top: 20upx;
+                padding: 0 20upx;
+                height: 88upx;
+                border-radius: 10upx;
+                border: 2upx solid #D8D8D8;
+                @include flcw(28upx, 40upx, #1A1A1A);
+            }
+            & + .ep-item{
+                margin-top: 20upx;
+            }
+        }
+    }
+</style>

src/subpackage/account/pages/permission/modules/info/edit_password.vue

@@ -0,0 +1,67 @@
+<template>
+    <fixed-modal title="修改密码">
+        <view class="edit-password">
+            <view class="ep-item">
+                <view class="ei-label"><text class="el-star">*</text>原密码</view>
+                <input class="ei-input" type="password" placeholder="请输入原密码" />
+            </view>
+            <view class="ep-item">
+                <view class="ei-label"><text class="el-star">*</text>确认新密码</view>
+                <input class="ei-input" type="password" placeholder="请输入新密码" />
+            </view>
+        </view>
+        <modal-button green>确认修改</modal-button>
+    </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">
+    .edit-password{
+        padding-top: 56upx;
+        padding-bottom: 60upx;
+        .ep-item{
+            padding:  0 40upx;
+            .ei-label{
+                @include flcw(28upx, 40upx, #1A1A1A);
+                .el-star{
+                    margin-right: 10upx;
+                    color: #EA5061;
+                }
+            }
+            .ei-input{
+                display: block;
+                margin-top: 20upx;
+                padding: 0 20upx;
+                height: 88upx;
+                border-radius: 10upx;
+                border: 2upx solid #D8D8D8;
+                @include flcw(28upx, 40upx, #1A1A1A);
+            }
+            & + .ep-item{
+                margin-top: 30upx;
+            }
+        }
+    }
+</style>

src/subpackage/account/pages/permission/modules/info/min_permission.vue

@@ -0,0 +1,62 @@
+<template>
+    <view class="min-permission">
+        <info-container title="商家助手小程序权限">
+            <template v-slot:title-right>
+                <view class="mp-tr-content">
+                    <view class="mtc-name">已绑定（微信用户）</view>
+                    <view class="mtc-status">解绑</view>
+                </view>
+            </template>
+            <template v-slot:content>
+                <view class="mp-content">
+                    <view class="mc-item" v-for="i in 7" :key="i">
+                        <permission-item :active="i%3 === 0"></permission-item>
+                    </view>
+                </view>
+            </template>
+        </info-container>
+    </view>
+</template>
+
+<script>
+import infoContainer from '../../../../components/info_container.vue';
+import permissionItem from './permission_item.vue';
+export default {
+    components: {
+        'info-container': infoContainer,
+        'permission-item': permissionItem
+    },
+}
+</script>
+
+<style lang="scss">
+.min-permission{
+    .mp-tr-content{
+        @include ctf(space-between);
+        .mtc-name{
+            flex-grow: 1;
+            @include flcw(24upx, 34upx, #9C9C9F);
+            @include tHide;
+        }
+        .mtc-status{
+            margin-left: 10upx;
+            flex-shrink: 0;
+            @include flcw(24upx, 34upx, #EA5061);
+        }
+    }
+    .mp-content{
+        padding: 0 20upx;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        .mc-item{
+            flex-shrink: 0;
+            flex-grow: 0;
+            width: 188upx;
+            &:nth-child(n + 4){
+                margin-top: 20upx;
+            }
+        }
+    }
+}
+</style>

src/subpackage/account/pages/permission/modules/info/permission_item.vue

@@ -0,0 +1,36 @@
+<template>
+    <view class="permission-item">
+        <image v-if="active" class="pi-icon"></image>
+        <text class="pi-txt" :class="{ 'pi-active': active }">订单管理</text>
+    </view>
+</template>
+
+<script>
+export default {
+    props: {
+        active: {
+            type: Boolean,
+            default: false
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+.permission-item{
+    @include tHide;
+    .pi-icon{
+        margin-right: 14upx;
+        width: 26upx;
+        height: 26upx;
+        background: skyblue;
+    }
+    .pi-txt{
+        @include flcw(28upx, 40upx, #9C9C9F, 500);
+        &.pi-active{
+            color: #1A1A1A;
+        }
+    }
+    
+}
+</style>

src/subpackage/account/pages/permission/modules/info/stadium_permission.vue

@@ -0,0 +1,34 @@
+<template>
+    <view class="stadium-permission">
+        <info-container title="门店权限">
+            <template v-slot:content>
+                <view class="sp-content">
+                    <view class="sp-item" v-for="i in 4" :key="i">
+                        <permission-item :active="i%3 === 0"></permission-item>
+                    </view>
+                </view>
+                
+            </template>
+        </info-container>
+    </view>
+</template>
+
+<script>
+import infoContainer from '../../../../components/info_container.vue';
+import permissionItem from './permission_item.vue';
+export default {
+    components: {
+        'info-container': infoContainer,
+        'permission-item': permissionItem
+    },
+}
+</script>
+
+<style lang="scss">
+.sp-content{
+    padding: 0 20upx;
+    .sp-item + .sp-item{
+        margin-top: 20upx;
+    }
+}
+</style>

src/subpackage/account/pages/permission/modules/title_bar.vue

@@ -1,17 +0,0 @@
-<template>
-    <view class="title-bar">
-
-    </view>
-</template>
-
-<script>
-export default {
-
-}
-</script>
-
-<style lang="scss">
-    .title-bar{
-        
-    }
-</style>