From 816e4a096e48096bfd2b1b0174499139df60970a Mon Sep 17 00:00:00 2001 From: RockYang Date: Fri, 29 Dec 2023 10:09:37 +0800 Subject: [PATCH] merge pull request #72 --- .../css/{admin-form.css => admin/form.css} | 0 .../css/{admin-form.styl => admin/form.styl} | 0 web/src/assets/css/mobile-chat-list.css | 57 -- web/src/assets/css/mobile-chat-session.css | 52 -- web/src/assets/css/mobile-invitation.css | 94 --- web/src/assets/css/mobile-profile.css | 156 ---- .../css/{mobile-apps.css => mobile/apps.css} | 17 +- .../{mobile-apps.styl => mobile/apps.styl} | 0 web/src/assets/css/mobile/chat-list.css | 47 ++ .../chat-list.styl} | 0 web/src/assets/css/mobile/chat-session.css | 45 ++ .../chat-session.styl} | 0 .../custom-scroll.css} | 0 .../custom-scroll.styl} | 0 .../css/{mobile-home.css => mobile/home.css} | 16 +- .../{mobile-home.styl => mobile/home.styl} | 0 .../image-list.css} | 0 .../image-list.styl} | 2 +- .../image-sd.css} | 63 +- .../image-sd.styl} | 4 +- web/src/assets/css/mobile/invitation.css | 93 +++ .../invitation.styl} | 0 web/src/assets/css/mobile/profile.css | 142 ++++ .../profile.styl} | 0 web/src/assets/css/mobile/sd-task-dialog.css | 72 ++ web/src/assets/css/mobile/sd-task-dialog.styl | 96 +++ web/src/assets/css/mobile/task-list.css | 106 +++ .../task-list.styl} | 0 web/src/assets/css/task-mobile-list.css | 115 --- web/src/components/mobile/ChatReply.vue | 16 +- web/src/views/admin/ChatModel.vue | 2 +- web/src/views/admin/SysConfig.vue | 2 +- web/src/views/mobile/Apps.vue | 12 +- web/src/views/mobile/ChatList.vue | 96 +-- web/src/views/mobile/ChatSession.vue | 172 ++--- web/src/views/mobile/Home.vue | 22 +- web/src/views/mobile/ImageSd.vue | 700 +++++++++--------- web/src/views/mobile/Invitation.vue | 152 ++-- web/src/views/mobile/Profile.vue | 191 ++--- 39 files changed, 1332 insertions(+), 1210 deletions(-) rename web/src/assets/css/{admin-form.css => admin/form.css} (100%) rename web/src/assets/css/{admin-form.styl => admin/form.styl} (100%) delete mode 100644 web/src/assets/css/mobile-chat-list.css delete mode 100644 web/src/assets/css/mobile-chat-session.css delete mode 100644 web/src/assets/css/mobile-invitation.css delete mode 100644 web/src/assets/css/mobile-profile.css rename web/src/assets/css/{mobile-apps.css => mobile/apps.css} (53%) rename web/src/assets/css/{mobile-apps.styl => mobile/apps.styl} (100%) create mode 100644 web/src/assets/css/mobile/chat-list.css rename web/src/assets/css/{mobile-chat-list.styl => mobile/chat-list.styl} (100%) create mode 100644 web/src/assets/css/mobile/chat-session.css rename web/src/assets/css/{mobile-chat-session.styl => mobile/chat-session.styl} (100%) rename web/src/assets/css/{custom-mobile-scroll.css => mobile/custom-scroll.css} (100%) rename web/src/assets/css/{custom-mobile-scroll.styl => mobile/custom-scroll.styl} (100%) rename web/src/assets/css/{mobile-home.css => mobile/home.css} (77%) rename web/src/assets/css/{mobile-home.styl => mobile/home.styl} (100%) rename web/src/assets/css/{image-mobile-list.css => mobile/image-list.css} (100%) rename web/src/assets/css/{image-mobile-list.styl => mobile/image-list.styl} (97%) rename web/src/assets/css/{image-mobile-sd.css => mobile/image-sd.css} (91%) rename web/src/assets/css/{image-mobile-sd.styl => mobile/image-sd.styl} (95%) create mode 100644 web/src/assets/css/mobile/invitation.css rename web/src/assets/css/{mobile-invitation.styl => mobile/invitation.styl} (100%) create mode 100644 web/src/assets/css/mobile/profile.css rename web/src/assets/css/{mobile-profile.styl => mobile/profile.styl} (100%) create mode 100644 web/src/assets/css/mobile/sd-task-dialog.css create mode 100644 web/src/assets/css/mobile/sd-task-dialog.styl create mode 100644 web/src/assets/css/mobile/task-list.css rename web/src/assets/css/{task-mobile-list.styl => mobile/task-list.styl} (100%) delete mode 100644 web/src/assets/css/task-mobile-list.css diff --git a/web/src/assets/css/admin-form.css b/web/src/assets/css/admin/form.css similarity index 100% rename from web/src/assets/css/admin-form.css rename to web/src/assets/css/admin/form.css diff --git a/web/src/assets/css/admin-form.styl b/web/src/assets/css/admin/form.styl similarity index 100% rename from web/src/assets/css/admin-form.styl rename to web/src/assets/css/admin/form.styl diff --git a/web/src/assets/css/mobile-chat-list.css b/web/src/assets/css/mobile-chat-list.css deleted file mode 100644 index 90ea05f7..00000000 --- a/web/src/assets/css/mobile-chat-list.css +++ /dev/null @@ -1,57 +0,0 @@ -.app-background { - background-color: #1c1c1c; - height: 100vh; -} -.mobile-chat-list { - background-color: #1c1c1c; - position: absolute; - top: 40px; - width: 100%; -} - .content { - .van-cell__value { - .chat-list-item { - display: flex; - font-size: 16; - color: #a3a3a3; - background-color: #1c1c1c; - .van-image { - min-width: 32px; - width: 32px; - height: 32px; - } - .van-ellipsis { - margin-top: 5px; - margin-left: 10px; - } - } - } - } - .van-picker-column { - .picker-option { - display: flex; - width: 100%; - padding: 0 10px; - .van-image { - width: 20px; - height: 20px; - margin-right: 5px; - } - } - } - .van-nav-bar { - .van-nav-bar__right { - .van-icon { - font-size: 20px; - } - } - } - .popup { - background-color: #1c1c1c; - } - .dialog { - background-color: #1c1c1c; - } - .field { - background-color: #1c1c1c; - } \ No newline at end of file diff --git a/web/src/assets/css/mobile-chat-session.css b/web/src/assets/css/mobile-chat-session.css deleted file mode 100644 index 7b476700..00000000 --- a/web/src/assets/css/mobile-chat-session.css +++ /dev/null @@ -1,52 +0,0 @@ -.app-background { - background-color: #1c1c1c; - height: 100vh; - } - body, - .mobile-chat, - .van-sticky, - .van-nav-bar, - .van-list, - .message-list-box - .van-cell, - .chat-box, - .van-cell-group, - .van-field { - background-color: #1c1c1c !important; - color: #fff !important; - } - .chat-box-wrapper { - position: fixed; - bottom: 0; - width: 100%; - background-color: #1c1c1c; - } - .icon-box .van-icon, - .mobile-chat .van-nav-bar__title .van-dropdown-menu__title, - .mobile-chat .van-nav-bar__title .van-cell__title, - .mobile-chat .van-nav-bar__right .van-icon { - color: #fff !important; - } - .mobile-chat { - .van-nav-bar__title { - .van-dropdown-menu__title { - margin-right: 15px; - } - - .van-cell__title { - text-align: left; - } - } - .chat-list-wrapper { - position: fixed; - top: 40px; - bottom: 60px; - width: 100vw; - overflow-y: scroll; - } - .van-nav-bar__right { - .van-icon { - font-size: 20px; - } - } - } \ No newline at end of file diff --git a/web/src/assets/css/mobile-invitation.css b/web/src/assets/css/mobile-invitation.css deleted file mode 100644 index d0ffc1b8..00000000 --- a/web/src/assets/css/mobile-invitation.css +++ /dev/null @@ -1,94 +0,0 @@ -.page-invitation { - display: flex; - justify-content: center; - background-color: #1c1c1c; - height: 100vh; - overflow-x: hidden; - overflow-y: visible; - .inner { - max-width: 100%; - width: 100%; - color: #fff; - .center { - display: flex; - justify-content: center; - align-items: center; - } - .title { - color: #fff; - text-align: center; - font-size: 16px; - font-weight: bold; - } - .share-box { - .info { - line-height: 1.5; - border: 1px solid #444444; - border-radius: 10px; - padding: 10px; - margin: 10px; - background-color: #1c1c1c; - strong { - color: #f56c6c; - } - } - .invite-qrcode { - text-align: center; - margin: 15px; - } - .invite-url { - margin: 10px; - padding: 8px; - display: flex; - justify-content: space-between; - border: 1px solid #444444; - border-radius: 10px; - background-color: #1c1c1c; - span { - position: relative; - font-size: 14px; - font-family: 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; - top: 0px; - } - } - } - .invite-stats { - padding: 10px 10px; - .item-box { - border-radius: 10px; - padding: 10 0px; - .el-col { - height: 80px; - display: flex; - align-items: center; - justify-content: center; - .iconfont { - font-size: 30px; - } - .item-info { - font-size: 14px; - .text, .num { - padding: 3px 0; - text-align: center; - } - .num { - font-size: 14px; - } - } - } - } - .yellow { - background-color: #ffeecc; - color: #D68F00; - } - .blue { - background-color: #D6E4FF; - color: #1062FE; - } - .green { - background-color: #E7F8EB; - color: #2D9F46; - } - } - } -} \ No newline at end of file diff --git a/web/src/assets/css/mobile-profile.css b/web/src/assets/css/mobile-profile.css deleted file mode 100644 index dfd2d056..00000000 --- a/web/src/assets/css/mobile-profile.css +++ /dev/null @@ -1,156 +0,0 @@ -.app-background { - background-color: #1c1c1c; - height: 100vh; -} -.member { - background-color: #282828; - height: 100vh; - .el-dialog { - .el-dialog__body { - padding-top: 5px; - .pay-container { - .count-down { - display: flex; - justify-content: center; - } - .pay-qrcode { - display flex - justify-content center - .el-image { - width: 25px; - height:25px; - } - } - .tip { - display flex - justify-content center - .el-icon { - font-size: 20px; - } - .text { - font-size: 16px; - margin-left: 10px; - } - } - .tip.success { - color: #07c160; - } - } - } - } - .title { - text-align: center; - background-color: #282828; - font-size:16px; - color: #ffffff; - padding: 10px; - } - .inner { - color: #ffffff; - overflow-x hidden - overflow-y visible - .user-profile { - padding: 0 20px 0 20px; - background-color: #282828; - color: #ffffff; - border-radius:10px; - width: 400px; - height: 100vh; - .el-form-item__label { - color: #ffffff; - justify-content: start; - } - .user-opt { - .el-col { - padding: 10px; - .el-button { - width: 100%; - } - } - } - } - .product-box { - .info { - .el-alert__description { - font-size: 14px !important; - margin: 0; - } - padding: 10px 20px 20px 0; - } - .list-box { - .product-item { - border: 1px solid #1c1c1c; - border-radius: 6px; - overflow: hidden; - cursor: pointer; - transition: all 0.3s ease; /* 添加过渡效果 */ - .image-container { - display flex - justify-content center - .el-image { - padding: 6px; - .el-image__inner { - border-radius: 10px; - } - } - } - .product-title { - display: flex; - padding: 10px; - .name { - width: 100%; - text-align: center; - font-size: 16px; - font-weight: bold; - color: #2cc995; - } - } - .product-info { - padding: 10px 20px; - font-size: 14px; - color: #999999; - .info-line { - display: flex; - width: 100%; - padding: 5px 0; - .label { - display: flex; - width: 100%; - } - .price, .expire { - display: flex; - width: 90px; - justify-content: right; - } - .price { - color: #f56c6c; - } - .expire { - color: #409eff; - } - } - .pay-way { - padding: 10px 0; - display: flex; - justify-content: space-between; - - .iconfont { - margin-right: 5px; - } - } - } - &:hover { - box-shadow: 0 0 10px rgba(71, 255, 241, 0.6); /* 添加阴影效果 */ - transform: translateY(-10px); /* 向上移动10像素 */ - } - } - } - .headline { - padding: 0 20px 20px 0; - } - .user-order { - padding: 0 20px 20px 0; - } - } - } -} \ No newline at end of file diff --git a/web/src/assets/css/mobile-apps.css b/web/src/assets/css/mobile/apps.css similarity index 53% rename from web/src/assets/css/mobile-apps.css rename to web/src/assets/css/mobile/apps.css index d4c9441c..8def06a8 100644 --- a/web/src/assets/css/mobile-apps.css +++ b/web/src/assets/css/mobile/apps.css @@ -8,13 +8,10 @@ background-color: #282828; height: 100vh; } -.mobile-setting { - .content { - padding-top: 60px; - - .van-field__label { - width: 100px; - text-align: right; - } - } -} \ No newline at end of file +.mobile-setting .content { + padding-top: 60px; +} +.mobile-setting .content .van-field__label { + width: 100px; + text-align: right; +} diff --git a/web/src/assets/css/mobile-apps.styl b/web/src/assets/css/mobile/apps.styl similarity index 100% rename from web/src/assets/css/mobile-apps.styl rename to web/src/assets/css/mobile/apps.styl diff --git a/web/src/assets/css/mobile/chat-list.css b/web/src/assets/css/mobile/chat-list.css new file mode 100644 index 00000000..88410db8 --- /dev/null +++ b/web/src/assets/css/mobile/chat-list.css @@ -0,0 +1,47 @@ +.app-background { + background-color: #1c1c1c; + height: 100vh; +} +.mobile-chat-list { + background-color: #1c1c1c; + position: absolute; + top: 40px; + width: 100%; +} +.content .van-cell__value .chat-list-item { + display: flex; + font-size: 16px; + color: #fff; + background-color: #1c1c1c; +} +.content .van-cell__value .chat-list-item .van-image { + min-width: 32px; + width: 32px; + height: 32px; +} +.content .van-cell__value .chat-list-item .van-ellipsis { + margin-top: 5px; + margin-left: 10px; +} +.van-picker-column .picker-option { + display: flex; + width: 100%; + padding: 0 10px; +} +.van-picker-column .picker-option .van-image { + width: 20px; + height: 20px; + margin-right: 5px; +} +.van-nav-bar .van-nav-bar__right .van-icon { + font-size: 20px; +} +.popup { + background-color: #1c1c1c; +} +.dialog { + background-color: #1c1c1c; +} +.field { + background-color: #1c1c1c; +} diff --git a/web/src/assets/css/mobile-chat-list.styl b/web/src/assets/css/mobile/chat-list.styl similarity index 100% rename from web/src/assets/css/mobile-chat-list.styl rename to web/src/assets/css/mobile/chat-list.styl diff --git a/web/src/assets/css/mobile/chat-session.css b/web/src/assets/css/mobile/chat-session.css new file mode 100644 index 00000000..1d077298 --- /dev/null +++ b/web/src/assets/css/mobile/chat-session.css @@ -0,0 +1,45 @@ +.app-background { + background-color: #1c1c1c; + height: 100vh; +} +body, +.mobile-chat, +.van-sticky, +.van-nav-bar, +.van-list, +.message-list-box, +.van-cell, +.chat-box, +.van-cell-group, +.van-field { + background-color: #1c1c1c !important; + color: #fff !important; +} +.chat-box-wrapper { + position: fixed; + bottom: 0; + width: 100%; + background-color: #1c1c1c; +} +.icon-box .van-icon, +.mobile-chat .van-nav-bar__title .van-dropdown-menu__title, +.mobile-chat .van-nav-bar__title .van-cell__title, +.mobile-chat .van-nav-bar__right .van-icon { + color: #fff !important; +} +.mobile-chat .van-nav-bar__title .van-dropdown-menu__title { + margin-right: 15px; +} +.mobile-chat .van-nav-bar__title .van-cell__title { + text-align: left; +} +.mobile-chat .chat-list-wrapper { + position: fixed; + top: 50px; + bottom: 60px; + width: 100vw; + overflow-y: scroll; +} +.mobile-chat .van-nav-bar__right .van-icon { + font-size: 20px; +} diff --git a/web/src/assets/css/mobile-chat-session.styl b/web/src/assets/css/mobile/chat-session.styl similarity index 100% rename from web/src/assets/css/mobile-chat-session.styl rename to web/src/assets/css/mobile/chat-session.styl diff --git a/web/src/assets/css/custom-mobile-scroll.css b/web/src/assets/css/mobile/custom-scroll.css similarity index 100% rename from web/src/assets/css/custom-mobile-scroll.css rename to web/src/assets/css/mobile/custom-scroll.css diff --git a/web/src/assets/css/custom-mobile-scroll.styl b/web/src/assets/css/mobile/custom-scroll.styl similarity index 100% rename from web/src/assets/css/custom-mobile-scroll.styl rename to web/src/assets/css/mobile/custom-scroll.styl diff --git a/web/src/assets/css/mobile-home.css b/web/src/assets/css/mobile/home.css similarity index 77% rename from web/src/assets/css/mobile-home.css rename to web/src/assets/css/mobile/home.css index d759ba44..25214688 100644 --- a/web/src/assets/css/mobile-home.css +++ b/web/src/assets/css/mobile/home.css @@ -1,6 +1,6 @@ .my-tabbar { - background-color: #171717; - box-shadow: -3px 4px 16px #000; + background-color: #171717; + box-shadow: -3px 4px 16px #000; box-sizing: border-box; } .banner { @@ -13,10 +13,10 @@ height: 40px; width: 100%; position: fixed; - z-index: 2; /* Add z-index */ -} + z-index: 2 /* Add z-index */; +} .banner-title { - color: #2CC995; + color: #2cc995; font-size: 20px; font-weight: bold; text-shadow: 0 -4px 13px #000; @@ -24,7 +24,7 @@ .mobile-home { background-color: #171717; } -.mobile-home .van-tabbar::before { +.mobile-home .van-tabbar before { position: absolute; bottom: 0; left: 0; @@ -37,9 +37,9 @@ transition: opacity 0.5s; z-index: -1; } -.mobile-home .van-tabbar.activeTab::before { +.mobile-home .van-tabbar.activeTab before { opacity: 1; } .router-view { margin-bottom: 50px; -} \ No newline at end of file +} diff --git a/web/src/assets/css/mobile-home.styl b/web/src/assets/css/mobile/home.styl similarity index 100% rename from web/src/assets/css/mobile-home.styl rename to web/src/assets/css/mobile/home.styl diff --git a/web/src/assets/css/image-mobile-list.css b/web/src/assets/css/mobile/image-list.css similarity index 100% rename from web/src/assets/css/image-mobile-list.css rename to web/src/assets/css/mobile/image-list.css diff --git a/web/src/assets/css/image-mobile-list.styl b/web/src/assets/css/mobile/image-list.styl similarity index 97% rename from web/src/assets/css/image-mobile-list.styl rename to web/src/assets/css/mobile/image-list.styl index 91b4f95d..c01efe10 100644 --- a/web/src/assets/css/image-mobile-list.styl +++ b/web/src/assets/css/mobile/image-list.styl @@ -87,7 +87,7 @@ } } - @import "task-mobile-list.styl" + @import "mobile/task-mobile-list.styl" } @import "sd-task-mobile-dialog.styl" diff --git a/web/src/assets/css/image-mobile-sd.css b/web/src/assets/css/mobile/image-sd.css similarity index 91% rename from web/src/assets/css/image-mobile-sd.css rename to web/src/assets/css/mobile/image-sd.css index e5e8bd74..6502ea4c 100644 --- a/web/src/assets/css/image-mobile-sd.css +++ b/web/src/assets/css/mobile/image-sd.css @@ -1,14 +1,17 @@ .page-sd { - background-color: #1c1c1c; + background-color: #282828; } .page-sd .inner { display: flex; + align-items: center; + justify-content: center; } .page-sd .inner .sd-box { - margin: 5px; - background-color: #1c1c1c; - min-width: 97%; - max-width: 97%; + background-color: #282828; + min-width: 92%; + max-width: 92%; + padding: 0px; + border-radius: 0px; color: #fff; font-size: 14px; } @@ -18,8 +21,13 @@ text-align: center; color: #fff; } +.page-sd .inner .sd-box ::-webkit-scrollbar { + width: 0; + height: 0; + background-color: transparent; +} .page-sd .inner .sd-box .sd-params { - margin-top: 5px; + margin-top: 10px; overflow: auto; } .page-sd .inner .sd-box .sd-params .param-line { @@ -46,7 +54,7 @@ padding-bottom: 5px; } .page-sd .inner .sd-box .submit-btn { - padding: 10px 15px 10px 15px; + padding: 10px 15px 0 15px; text-align: center; } .page-sd .inner .sd-box .submit-btn .el-button { @@ -60,6 +68,7 @@ } .page-sd .inner .task-list-box { width: 100%; + padding: 5px; color: #fff; overflow-x: hidden; } @@ -77,6 +86,8 @@ position: absolute; width: 100%; height: 100%; + top: 0; + left: 0; display: flex; justify-content: center; align-items: center; @@ -89,7 +100,7 @@ width: 100%; height: 100%; border: 1px solid #666; - padding: 3px; + padding: 6px; overflow: hidden; border-radius: 6px; transition: all 0.3s ease; /* 添加过渡效果 */ @@ -131,7 +142,7 @@ overflow: visible; } .page-sd .inner .task-list-box .el-image img { - height: 100%; + height: 240px; } .page-sd .inner .task-list-box .el-image .el-image-viewer__wrapper img { width: auto; @@ -152,10 +163,10 @@ margin-bottom: 10px; } .page-sd .inner .task-list-box .el-image.upscale { - max-height: 100%; + max-height: 310px; } .page-sd .inner .task-list-box .el-image.upscale img { - height: 100%; + height: 310px; } .page-sd .inner .task-list-box .el-image.upscale .el-image-viewer__wrapper img { width: auto; @@ -200,8 +211,8 @@ padding: 10px; color: #999; overflow: auto; - max-height: 100%; - min-height: 100%; + max-height: 100px; + min-height: 50px; position: relative; } .page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .prompt .el-icon { @@ -216,7 +227,7 @@ } .page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .wrapper label { display: flex; - width:100%; + width: 100px; color: #a5a5a5; } .page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .wrapper .item-value { @@ -228,34 +239,14 @@ color: #f5f5f5; } .page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .copy-params { - padding: 20px 0 10px 0; + padding: 30px 0 10px 0; } .page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .copy-params .el-button { width: 100%; } .page-sd .mj-list-item-prompt .el-icon { - + margin-left: 10px; cursor: pointer; position: relative; top: 2px; } -.mobile-dialog { - display: flex; - justify-content: center; - align-items: center; - height: 100vh; -} - -/* 针对手机屏幕的样式 */ -.mobile-form-row { - display: flex; - justify-content: center; - align-items: center; - height: 100vh; -} -.mobile-form-col { - width: 100%; - max-width: 500px; - padding: 30px; - box-sizing: border-box; -} \ No newline at end of file diff --git a/web/src/assets/css/image-mobile-sd.styl b/web/src/assets/css/mobile/image-sd.styl similarity index 95% rename from web/src/assets/css/image-mobile-sd.styl rename to web/src/assets/css/mobile/image-sd.styl index 8f615f86..7cc97a20 100644 --- a/web/src/assets/css/image-mobile-sd.styl +++ b/web/src/assets/css/mobile/image-sd.styl @@ -87,10 +87,10 @@ } } - @import "task-mobile-list.styl" + @import "./task-list.styl" } - @import "sd-task-mobile-dialog.styl" + @import "./sd-task-dialog.styl" .mj-list-item-prompt { diff --git a/web/src/assets/css/mobile/invitation.css b/web/src/assets/css/mobile/invitation.css new file mode 100644 index 00000000..2d8e6d55 --- /dev/null +++ b/web/src/assets/css/mobile/invitation.css @@ -0,0 +1,93 @@ +.page-invitation { + display: flex; + justify-content: center; + background-color: #1c1c1c; + height: 100vh; + overflow-x: hidden; + overflow-y: visible; +} +.page-invitation .inner { + max-width: 100%; + width: 100%; + color: #fff; +} +.page-invitation .inner .center { + display: flex; + justify-content: center; + align-items: center; +} +.page-invitation .inner .title { + color: #fff; + text-align: center; + font-size: 16px; + font-weight: bold; +} +.page-invitation .inner .share-box .info { + line-height: 1.5; + border: 1px solid #444; + border-radius: 10px; + padding: 10px; + margin: 10px; + background-color: #1c1c1c; +} +.page-invitation .inner .share-box .info strong { + color: #f56c6c; +} +.page-invitation .inner .share-box .invite-qrcode { + text-align: center; + margin: 15px; +} +.page-invitation .inner .share-box .invite-url { + margin: 10px; + padding: 8px; + display: flex; + justify-content: space-between; + border: 1px solid #444; + border-radius: 10px; + background-color: #1c1c1c; +} +.page-invitation .inner .share-box .invite-url span { + position: relative; + font-size: 14px; + font-family: 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; + top: 0px; +} +.page-invitation .inner .invite-stats { + padding: 10px 10px; +} +.page-invitation .inner .invite-stats .item-box { + border-radius: 10px; + padding: 10 0px; +} +.page-invitation .inner .invite-stats .item-box .el-col { + height: 80px; + display: flex; + align-items: center; + justify-content: center; +} +.page-invitation .inner .invite-stats .item-box .el-col .iconfont { + font-size: 30px; +} +.page-invitation .inner .invite-stats .item-box .el-col .item-info { + font-size: 14px; +} +.page-invitation .inner .invite-stats .item-box .el-col .item-info .text, +.page-invitation .inner .invite-stats .item-box .el-col .item-info .num { + padding: 3px 0; + text-align: center; +} +.page-invitation .inner .invite-stats .item-box .el-col .item-info .num { + font-size: 14px; +} +.page-invitation .inner .invite-stats .yellow { + background-color: #fec; + color: #d68f00; +} +.page-invitation .inner .invite-stats .blue { + background-color: #d6e4ff; + color: #1062fe; +} +.page-invitation .inner .invite-stats .green { + background-color: #e7f8eb; + color: #2d9f46; +} diff --git a/web/src/assets/css/mobile-invitation.styl b/web/src/assets/css/mobile/invitation.styl similarity index 100% rename from web/src/assets/css/mobile-invitation.styl rename to web/src/assets/css/mobile/invitation.styl diff --git a/web/src/assets/css/mobile/profile.css b/web/src/assets/css/mobile/profile.css new file mode 100644 index 00000000..b80f603f --- /dev/null +++ b/web/src/assets/css/mobile/profile.css @@ -0,0 +1,142 @@ +.app-background { + background-color: #1c1c1c; + height: 100vh; +} +.member { + background-color: #1c1c1c; + height: 100vh; +} +.member .el-dialog .el-dialog__body { + padding-top: 5px; +} +.member .el-dialog .el-dialog__body .pay-container .count-down { + display: flex; + justify-content: center; +} +.member .el-dialog .el-dialog__body .pay-container .pay-qrcode { + display: flex; + justify-content: center; +} +.member .el-dialog .el-dialog__body .pay-container .pay-qrcode .el-image { + width: 280px; + height: 280px; +} +.member .el-dialog .el-dialog__body .pay-container .tip { + display: flex; + justify-content: center; +} +.member .el-dialog .el-dialog__body .pay-container .tip .el-icon { + font-size: 20px; +} +.member .el-dialog .el-dialog__body .pay-container .tip .text { + font-size: 16px; + margin-left: 10px; +} +.member .el-dialog .el-dialog__body .pay-container .tip.success { + color: #07c160; +} +.member .title { + text-align: center; + background-color: #1c1c1c; + font-size: 16px; + color: #fff; + padding: 5px; + font-weight: bold; +} +.member .inner { + color: #fff; + overflow-x: hidden; + overflow-y: visible; +} +.member .inner .user-profile { + padding: 0 20px 0 20px; + background-color: #1c1c1c; + color: #fff; + border-radius: 10px; + width: 100%; + height: 91vh; +} +.member .inner .user-profile .el-form-item__label { + color: #fff; + justify-content: start; +} +.member .inner .user-profile .user-opt .el-col { + padding: 8px; +} +.member .inner .user-profile .user-opt .el-col .el-button { + width: 100%; +} +.member .inner .product-box .info { + padding: 0 20px 0 20px; +} +.member .inner .product-box .info .el-alert__description { + font-size: 14px !important; + color: #1c1c1c; + margin: 0; +} +.member .inner .product-box .list-box { + padding: 0 20px 0 5px; +} +.member .inner .product-box .list-box .product-item { + border: 1px solid #5f5f5f; + border-radius: 6px; + overflow: hidden; + cursor: pointer; + transition: all 0.3s ease /* 添加过渡效果 */; +} +.member .inner .product-box .list-box .product-item .image-container { + display: flex; + justify-content: center; +} +.member .inner .product-box .list-box .product-item .image-container .el-image { + width: 50px; +} +.member .inner .product-box .list-box .product-item .image-container .el-image .el-image__inner { + border-radius: 10px; +} +.member .inner .product-box .list-box .product-item .product-title { + display: flex; + padding: 5px; +} +.member .inner .product-box .list-box .product-item .product-title .name { + width: 100%; + text-align: center; + font-size: 16px; + font-weight: bold; + color: #2cc995; +} +.member .inner .product-box .list-box .product-item .product-info { + padding: 10px 20px; + font-size: 14px; + color: #999; +} +.member .inner .product-box .list-box .product-item .product-info .info-line { + display: flex; + width: 100%; + padding: 2px 0; +} +.member .inner .product-box .list-box .product-item .product-info .info-line .label { + display: flex; + width: 100%; +} +.member .inner .product-box .list-box .product-item .product-info .info-line .price, +.member .inner .product-box .list-box .product-item .product-info .info-line .expire { + display: flex; + width: 100%; + justify-content: right; +} +.member .inner .product-box .list-box .product-item .product-info .info-line .price { + color: #f56c6c; +} +.member .inner .product-box .list-box .product-item .product-info .info-line .expire { + color: #409eff; +} +.member .inner .product-box .list-box .product-item .product-info .pay-way { + padding: 5px 0; + display: flex; + justify-content: space-between; +} +.member .inner .product-box .list-box .product-item hover { + box-shadow: 0 0 10px rgba(71,255,241,0.6) /* 添加阴影效果 */; + transform: translateY(-10px) /* 向上移动10像素 */; +} diff --git a/web/src/assets/css/mobile-profile.styl b/web/src/assets/css/mobile/profile.styl similarity index 100% rename from web/src/assets/css/mobile-profile.styl rename to web/src/assets/css/mobile/profile.styl diff --git a/web/src/assets/css/mobile/sd-task-dialog.css b/web/src/assets/css/mobile/sd-task-dialog.css new file mode 100644 index 00000000..611e7d38 --- /dev/null +++ b/web/src/assets/css/mobile/sd-task-dialog.css @@ -0,0 +1,72 @@ +.el-overlay-dialog .el-dialog { + background-color: #1a1b1e; +} +.el-overlay-dialog .el-dialog .el-dialog__header .el-dialog__title { + color: #f5f5f5; +} +.el-overlay-dialog .el-dialog .el-dialog__body { + padding: 0 0 0 15px !important; + display: flex; + height: 100%; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row { + width: 100%; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container { + display: flex; + justify-content: center; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container .image-slot { + display: flex; + height: 100vh; + align-items: center; + justify-content: center; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container .image-slot .el-icon { + font-size: 60px; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info { + background-color: #25262b; + padding: 1rem 1.5rem; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line { + width: 100%; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .prompt { + background-color: #35363b; + padding: 10px; + color: #999; + overflow: auto; + max-height: 100px; + min-height: 50px; + position: relative; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .prompt .el-icon { + position: absolute; + right: 10px; + bottom: 10px; + cursor: pointer; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .wrapper { + margin-top: 10px; + display: flex; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .wrapper label { + display: flex; + width: 100px; + color: #a5a5a5; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .info-line .wrapper .item-value { + display: flex; + width: 100%; + background-color: #35363b; + padding: 2px 5px; + border-radius: 5px; + color: #f5f5f5; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .copy-params { + padding: 30px 0 10px 0; +} +.el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info .copy-params .el-button { + width: 100%; +} diff --git a/web/src/assets/css/mobile/sd-task-dialog.styl b/web/src/assets/css/mobile/sd-task-dialog.styl new file mode 100644 index 00000000..d0c93b1c --- /dev/null +++ b/web/src/assets/css/mobile/sd-task-dialog.styl @@ -0,0 +1,96 @@ +.el-overlay-dialog { + .el-dialog { + background-color #1a1b1e + + .el-dialog__header { + .el-dialog__title { + color #F5F5F5 + } + } + + .el-dialog__body { + padding 0 0 0 15px !important + display flex + height 100% + + .el-row { + width 100% + + .img-container { + display flex + justify-content center + + .image-slot { + display flex + height 100vh + align-items center + justify-content center + + .el-icon { + font-size 60px + } + } + } + + .task-info { + background-color #25262b + padding 1rem 1.5rem + + .info-line { + width 100% + + .prompt { + background-color #35363b + padding 10px + color #999999 + overflow auto + max-height 100px + min-height 50px + + position relative + + .el-icon { + position absolute + right 10px + bottom 10px + cursor pointer + } + } + + .wrapper { + margin-top 10px + display flex + + label { + display flex + width 100px + color #a5a5a5 + } + + .item-value { + display flex + width 100% + background-color #35363b + padding 2px 5px + border-radius 5px + color #F5F5F5 + } + } + + } + + .copy-params { + padding 30px 0 10px 0 + + .el-button { + width 100% + } + } + } + } + + // end el-row + + } + } +} \ No newline at end of file diff --git a/web/src/assets/css/mobile/task-list.css b/web/src/assets/css/mobile/task-list.css new file mode 100644 index 00000000..6754ac94 --- /dev/null +++ b/web/src/assets/css/mobile/task-list.css @@ -0,0 +1,106 @@ +.task-list-box { + width: 100%; + padding: 5px; + color: #fff; + overflow-x: hidden; +} +.task-list-box .running-job-list .job-item { + width: 100%; + padding: 2px; + background-color: #555; +} +.task-list-box .running-job-list .job-item .job-item-inner { + position: relative; + height: 100%; + overflow: hidden; +} +.task-list-box .running-job-list .job-item .job-item-inner .progress { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + display: flex; + justify-content: center; + align-items: center; +} +.task-list-box .running-job-list .job-item .job-item-inner .progress span { + font-size: 20px; + color: #fff; +} +.task-list-box .finish-job-list .job-item { + width: 100%; + height: 100%; + border: 1px solid #666; + padding: 6px; + overflow: hidden; + border-radius: 6px; + transition: all 0.3s ease; /* 添加过渡效果 */ +} +.task-list-box .finish-job-list .job-item .opt .opt-line { + margin: 6px 0; +} +.task-list-box .finish-job-list .job-item .opt .opt-line ul { + display: flex; + flex-flow: row; +} +.task-list-box .finish-job-list .job-item .opt .opt-line ul li { + margin-right: 6px; +} +.task-list-box .finish-job-list .job-item .opt .opt-line ul li a { + padding: 3px 0; + width: 40px; + text-align: center; + border-radius: 5px; + display: block; + cursor: pointer; + background-color: #4e5058; + color: #fff; +} +.task-list-box .finish-job-list .job-item .opt .opt-line ul li a:hover { + background-color: #6d6f78; +} +.task-list-box .finish-job-list .job-item .opt .opt-line ul .show-prompt { + font-size: 20px; + cursor: pointer; +} +.task-list-box .finish-job-list .animate:hover { + box-shadow: 0 0 10px rgba(71,255,241,0.6); /* 添加阴影效果 */ + transform: translateY(-10px); /* 向上移动10像素 */ +} +.task-list-box .el-image { + width: 100%; + height: 100%; + overflow: visible; +} +.task-list-box .el-image img { + height: 240px; +} +.task-list-box .el-image .el-image-viewer__wrapper img { + width: auto; + height: auto; +} +.task-list-box .el-image .image-slot { + display: flex; + flex-flow: column; + justify-content: center; + align-items: center; + height: 100%; + min-height: 200px; + color: #fff; + height: 240px; +} +.task-list-box .el-image .image-slot .iconfont { + font-size: 50px; + margin-bottom: 10px; +} +.task-list-box .el-image.upscale { + max-height: 310px; +} +.task-list-box .el-image.upscale img { + height: 310px; +} +.task-list-box .el-image.upscale .el-image-viewer__wrapper img { + width: auto; + height: auto; +} diff --git a/web/src/assets/css/task-mobile-list.styl b/web/src/assets/css/mobile/task-list.styl similarity index 100% rename from web/src/assets/css/task-mobile-list.styl rename to web/src/assets/css/mobile/task-list.styl diff --git a/web/src/assets/css/task-mobile-list.css b/web/src/assets/css/task-mobile-list.css deleted file mode 100644 index f892fbed..00000000 --- a/web/src/assets/css/task-mobile-list.css +++ /dev/null @@ -1,115 +0,0 @@ -.task-list-box { - width: 100%; - padding: 10px; - color: #fff; - overflow-x: hidden; -} - -.task-list-box .running-job-list .job-item { - width: 100%; - padding: 2px; - background-color: #555; -} - -.task-list-box .running-job-list .job-item .job-item-inner { - position: relative; - height: 100%; - overflow: hidden; -} - -.task-list-box .running-job-list .job-item .job-item-inner .progress { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - display: flex; - justify-content: center; - align-items: center; -} - -.task-list-box .running-job-list .job-item .job-item-inner .progress span { - font-size: 20px; - color: #fff; -} - -.task-list-box .finish-job-list .job-item { - width: 100%; - height: 100%; -} - -.task-list-box .finish-job-list .job-item .opt .opt-line { - margin: 6px 0; -} - -.task-list-box .finish-job-list .job-item .opt .opt-line ul { - display: flex; - flex-flow: row; -} - -.task-list-box .finish-job-list .job-item .opt .opt-line ul li { - margin-right: 10px; -} - -.task-list-box .finish-job-list .job-item .opt .opt-line ul li a { - padding: 3px 0; - width: 44px; - text-align: center; - border-radius: 5px; - display: block; - cursor: pointer; - background-color: #4e5058; - color: #fff; -} - -.task-list-box .finish-job-list .job-item .opt .opt-line ul li a:hover { - background-color: #6d6f78; -} - -.task-list-box .finish-job-list .job-item .opt .opt-line ul .show-prompt { - font-size: 20px; - cursor: pointer; -} - -.task-list-box .el-image { - width: 100%; - height: 100%; - max-height: 240px; -} - -.task-list-box .el-image img { - height: 240px; -} - -.task-list-box .el-image .el-image-viewer__wrapper img { - width: auto; - height: auto; -} - -.task-list-box .el-image .image-slot { - display: flex; - flex-flow: column; - justify-content: center; - align-items: center; - height: 100%; - min-height: 200px; - color: #fff; -} - -.task-list-box .el-image .image-slot .iconfont { - font-size: 50px; - margin-bottom: 10px; -} - -.task-list-box .el-image.upscale { - max-height: 312px; -} - -.task-list-box .el-image.upscale img { - height: 312px; -} - -.task-list-box .el-image.upscale .el-image-viewer__wrapper img { - width: auto; - height: auto; -} diff --git a/web/src/components/mobile/ChatReply.vue b/web/src/components/mobile/ChatReply.vue index ca8be51b..3819ec05 100644 --- a/web/src/components/mobile/ChatReply.vue +++ b/web/src/components/mobile/ChatReply.vue @@ -106,11 +106,17 @@ onMounted(() => { margin-top 0 } - p > code { - color #2b2b2b - background-color #c1c1c1 - padding 2px 5px - border-radius 5px + p { + code { + color #2b2b2b + background-color #c1c1c1 + padding 2px 5px + border-radius 5px + } + + img { + max-width 100% + } } } } diff --git a/web/src/views/admin/ChatModel.vue b/web/src/views/admin/ChatModel.vue index c19ecf87..34d73dd3 100644 --- a/web/src/views/admin/ChatModel.vue +++ b/web/src/views/admin/ChatModel.vue @@ -232,7 +232,7 @@ const remove = function (row) { diff --git a/web/src/views/mobile/ChatList.vue b/web/src/views/mobile/ChatList.vue index de9a3383..7cc67973 100644 --- a/web/src/views/mobile/ChatList.vue +++ b/web/src/views/mobile/ChatList.vue @@ -1,52 +1,52 @@ \ No newline at end of file diff --git a/web/src/views/mobile/ChatSession.vue b/web/src/views/mobile/ChatSession.vue index f6e8fc6b..0d708fbe 100644 --- a/web/src/views/mobile/ChatSession.vue +++ b/web/src/views/mobile/ChatSession.vue @@ -1,93 +1,93 @@