style: 项目风格样式调整

This commit is contained in:
hzj 2026-04-13 18:26:12 +08:00
parent 6d80d8f61a
commit 7f1d8f1a86
46 changed files with 787 additions and 153 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 124 KiB

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 75 KiB

View File

@ -73,8 +73,17 @@ export default {
margin-left: 8px; margin-left: 8px;
.no-redirect { .no-redirect {
color: #97a8be; color: #A47D57;
cursor: text; cursor: text;
} }
a {
color: #7F6040;
transition: color .2s ease;
}
a:hover {
color: #FF9326;
}
} }
</style> </style>

View File

@ -157,6 +157,7 @@ export default {
cursor: pointer; cursor: pointer;
font-size: 18px; font-size: 18px;
vertical-align: middle; vertical-align: middle;
color: #B47A40;
} }
.header-search-select { .header-search-select {
@ -175,7 +176,7 @@ export default {
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
box-shadow: none !important; box-shadow: none !important;
border-bottom: 1px solid #d9d9d9; border-bottom: 1px solid rgba(255, 147, 38, 0.35);
vertical-align: middle; vertical-align: middle;
} }
} }

View File

@ -115,7 +115,7 @@ export default {
float: left; float: left;
line-height: 20px; line-height: 20px;
&:hover { &:hover {
color: #409eff; color: #FF9326;
} }
cursor: pointer; cursor: pointer;
.icon-content { .icon-content {

View File

@ -1,7 +1,7 @@
<template> <template>
<el-color-picker <el-color-picker
v-model="theme" v-model="theme"
:predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]" :predefine="['#FF9326', '#FEB219', '#F57C00', '#D9642A', '#304156', '#212121', '#11A983', '#F5222D']"
class="theme-picker" class="theme-picker"
popper-class="theme-picker-dropdown" popper-class="theme-picker-dropdown"
/> />
@ -9,7 +9,7 @@
<script> <script>
const version = require('element-ui/package.json').version // element-ui version from node_modules const version = require('element-ui/package.json').version // element-ui version from node_modules
const ORIGINAL_THEME = '#409EFF' // default color const ORIGINAL_THEME = '#FF9326' // default color
export default { export default {
data() { data() {

View File

@ -2,8 +2,8 @@
<div class="user-input"> <div class="user-input">
<el-input v-model.trim="inputValue" clearable :disabled="!sysOriginVal" :placeholder="placeholder" class="input-with-select" @input="handleInput"> <el-input v-model.trim="inputValue" clearable :disabled="!sysOriginVal" :placeholder="placeholder" class="input-with-select" @input="handleInput">
<el-select slot="prepend" v-model="selectType" placeholder="类型" :disabled="!sysOriginVal" @change="selectTypeChange"> <el-select slot="prepend" v-model="selectType" placeholder="类型" :disabled="!sysOriginVal" @change="selectTypeChange">
<el-option label="长ID" value="LONG" />
<el-option label="短ID" value="SHORT" /> <el-option label="短ID" value="SHORT" />
<el-option label="长ID" value="LONG" />
</el-select> </el-select>
<el-select v-if="showSysOriginTypeSelect && selectType !== 'LONG' && permissionsSysOriginPlatforms.length > 0" slot="append" v-model="sysOriginType" placeholder="平台" @change="sysOriginTypeChange"> <el-select v-if="showSysOriginTypeSelect && selectType !== 'LONG' && permissionsSysOriginPlatforms.length > 0" slot="append" v-model="sysOriginType" placeholder="平台" @change="sysOriginTypeChange">

View File

@ -24,8 +24,8 @@
placeholder="类型" placeholder="类型"
@change="clickSearch" @change="clickSearch"
> >
<el-option label="长ID" value="LONG_ID" />
<el-option label="短ID" value="SHORT_ID" /> <el-option label="短ID" value="SHORT_ID" />
<el-option label="长ID" value="LONG_ID" />
</el-select> </el-select>
</el-input> </el-input>
</el-tooltip> </el-tooltip>

View File

@ -238,7 +238,7 @@ export default {
/* 以下强行修改了el-slider样式 */ /* 以下强行修改了el-slider样式 */
.progressBar /deep/ .el-slider__bar { .progressBar /deep/ .el-slider__bar {
height: 3px; height: 3px;
background-color: #409EFF; background-color: #FF9326;
border-top-left-radius: 3px; border-top-left-radius: 3px;
border-bottom-left-radius: 3px; border-bottom-left-radius: 3px;
position: absolute; position: absolute;
@ -326,6 +326,6 @@ export default {
.rateOptions span:hover { .rateOptions span:hover {
background-color: #cec9c95a; background-color: #cec9c95a;
color: #409EFF; color: #FF9326;
} }
</style> </style>

View File

@ -1,23 +1,23 @@
// 注册来源 // 注册来源
const registerOrigins = [ const registerOrigins = [
{ value: "MOBILE", name: "手机号码" }, { value: "MOBILE", name: "手机号码" },
{ value: "FACEBOOK", name: "Facebook" },
{ value: "GOOGLE", name: "Google" },
{ value: "APPLE", name: "Apple" }, { value: "APPLE", name: "Apple" },
{ value: "GOOGLE", name: "Google" },
{ value: "FACEBOOK", name: "Facebook" },
{ value: "SNAPCHAT", name: "Snapchat" } { value: "SNAPCHAT", name: "Snapchat" }
]; ];
// 来源平台 // 来源平台
const originPlatforms = [ const originPlatforms = [
{ value: "iOS", name: "iOS" },
{ value: "Android", name: "Android" }, { value: "Android", name: "Android" },
{ value: "iOS", name: "iOS" },
{ value: "H5", name: "H5" } { value: "H5", name: "H5" }
]; ];
// app平台 // app平台
const appPlatforms = [ const appPlatforms = [
{ value: "iOS", name: "iOS" }, { value: "Android", name: "Android" },
{ value: "Android", name: "Android" } { value: "iOS", name: "iOS" }
]; ];
// 设备平台 // 设备平台

View File

@ -643,11 +643,6 @@ const productTypes = [
// 平台 // 平台
const platformOrigins = [ const platformOrigins = [
{
value: "iOS",
name: "iOS",
channels: [{ name: "AppStore", value: "AppStore" }]
},
{ {
value: "Android", value: "Android",
name: "Android", name: "Android",
@ -655,6 +650,11 @@ const platformOrigins = [
{ name: "Google", value: "Google" }, { name: "Google", value: "Google" },
{ name: "Huawei", value: "Huawei" } { name: "Huawei", value: "Huawei" }
] ]
},
{
value: "iOS",
name: "iOS",
channels: [{ name: "AppStore", value: "AppStore" }]
} }
]; ];

View File

@ -156,8 +156,10 @@ export default {
height: 50px; height: 50px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
background: #fff; background: linear-gradient(90deg, rgba(255, 250, 243, 0.96), rgba(255, 244, 228, 0.94));
box-shadow: 0 1px 4px rgba(0,21,41,.08); border-bottom: 1px solid rgba(255, 147, 38, 0.12);
box-shadow: 0 10px 30px rgba(111, 67, 25, 0.08);
backdrop-filter: blur(12px);
.hamburger-container { .hamburger-container {
line-height: 46px; line-height: 46px;
@ -168,7 +170,7 @@ export default {
-webkit-tap-highlight-color:transparent; -webkit-tap-highlight-color:transparent;
&:hover { &:hover {
background: rgba(0, 0, 0, .025) background: rgba(255, 147, 38, 0.08)
} }
} }
@ -189,7 +191,7 @@ export default {
padding: 0 8px; padding: 0 8px;
height: 100%; height: 100%;
font-size: 18px; font-size: 18px;
color: #5a5e66; color: #7A5C3F;
vertical-align: text-bottom; vertical-align: text-bottom;
&.hover-effect { &.hover-effect {
@ -197,7 +199,8 @@ export default {
transition: background .3s; transition: background .3s;
&:hover { &:hover {
background: rgba(0, 0, 0, .025) background: rgba(255, 147, 38, 0.08);
color: #FF9326;
} }
} }
} }
@ -214,6 +217,7 @@ export default {
border-radius: 100%; border-radius: 100%;
color: #FFFFFF; color: #FFFFFF;
font-weight: bold; font-weight: bold;
box-shadow: 0 10px 24px rgba(255, 147, 38, 0.24);
} }
.el-icon-caret-bottom { .el-icon-caret-bottom {
@ -222,6 +226,7 @@ export default {
right: -20px; right: -20px;
top: 20px; top: 20px;
font-size: 12px; font-size: 12px;
color: #A77441;
} }
} }
} }

View File

@ -0,0 +1,173 @@
<template>
<div class="navbar">
<hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
<breadcrumb class="breadcrumb-container" />
<div class="right-menu flex-r">
<template v-if="device !== 'mobile'">
<search id="header-search" class="right-menu-item" />
<screenfull id="screenfull" class="right-menu-item hover-effect" />
<el-tooltip content="Global Size" effect="dark" placement="bottom">
<size-select id="size-select" class="right-menu-item hover-effect" />
</el-tooltip>
</template>
<el-dropdown class="avatar-container" trigger="click">
<div class="avatar-wrapper">
<div class="user-avatar flex-c" :style="userAvatarColor">{{ firstNameStr }}</div>
<i class="el-icon-caret-bottom" />
</div>
<el-dropdown-menu slot="dropdown" class="user-dropdown">
<el-dropdown-item @click.native="resetPwd">修改密码</el-dropdown-item>
<el-dropdown-item @click.native="logout">退出登录</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<rest-password v-if="resetPasswordVisible" @success="resetPasswordVisible=false" @close="resetPasswordVisible=false" />
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import Breadcrumb from '@/components/Breadcrumb'
import Hamburger from '@/components/Hamburger'
import RestPassword from '@/components/data/RestPassword'
import Screenfull from '@/components/Screenfull'
import SizeSelect from '@/components/SizeSelect'
import Search from '@/components/HeaderSearch'
import { extractColorByText } from '@/utils'
export default {
name: 'NavbarLight',
components: {
Breadcrumb,
Hamburger,
RestPassword,
Screenfull,
SizeSelect,
Search
},
data() {
return {
resetPasswordVisible: false
}
},
computed: {
...mapGetters([
'sidebar',
'avatar',
'device',
'dashboard',
'name'
]),
userAvatarColor() {
return 'background-color:' + extractColorByText(this.name) + ';'
},
firstNameStr() {
return this.name ? this.name.trim().charAt(0) : '?'
}
},
methods: {
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
resetPwd() {
this.resetPasswordVisible = true
},
async logout() {
this.$store.dispatch('user/resetToken').then(() => {
location.reload()
})
}
}
}
</script>
<style lang="scss" scoped>
.navbar {
height: 50px;
overflow: hidden;
position: relative;
background: linear-gradient(90deg, rgba(255, 250, 243, 0.96), rgba(255, 244, 228, 0.94));
border-bottom: 1px solid rgba(255, 147, 38, 0.12);
box-shadow: 0 10px 30px rgba(111, 67, 25, 0.08);
backdrop-filter: blur(12px);
.hamburger-container {
line-height: 46px;
height: 100%;
float: left;
cursor: pointer;
transition: background .3s;
-webkit-tap-highlight-color: transparent;
&:hover {
background: rgba(255, 147, 38, 0.08);
}
}
.breadcrumb-container {
float: left;
}
.right-menu {
float: right;
height: 100%;
line-height: 50px;
&:focus {
outline: none;
}
.right-menu-item {
display: inline-block;
padding: 0 8px;
height: 100%;
font-size: 18px;
color: #7A5C3F;
vertical-align: text-bottom;
&.hover-effect {
cursor: pointer;
transition: background .3s;
&:hover {
background: rgba(255, 147, 38, 0.08);
color: #FF9326;
}
}
}
.avatar-container {
margin-right: 30px;
.avatar-wrapper {
position: relative;
.user-avatar {
cursor: pointer;
width: 35px;
height: 35px;
border-radius: 100%;
color: #FFFFFF;
font-weight: bold;
box-shadow: 0 10px 24px rgba(255, 147, 38, 0.24);
}
.el-icon-caret-bottom {
cursor: pointer;
position: absolute;
right: -20px;
top: 20px;
font-size: 12px;
color: #A77441;
}
}
}
}
}
</style>

View File

@ -1,22 +1,27 @@
<template> <template>
<div class="sidebar-logo-container" :class="{'collapse':collapse}"> <div class="sidebar-logo-container" :class="{ collapse: collapse }">
<transition name="sidebarLogoFade"> <transition name="sidebarLogoFade">
<router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/"> <router-link
<img v-if="logo" :src="logo" class="sidebar-logo"> v-if="collapse"
<h1 v-else class="sidebar-title">{{ title }} </h1> key="collapse"
class="sidebar-logo-link"
to="/"
>
<img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 v-else class="sidebar-title">{{ title }}</h1>
</router-link> </router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/"> <router-link v-else key="expand" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo"> <img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 class="sidebar-title">{{ title }} </h1> <h1 class="sidebar-title">{{ title }}</h1>
</router-link> </router-link>
</transition> </transition>
</div> </div>
</template> </template>
<script> <script>
import logo from '@/assets/logo_new.png' import logo from "@/assets/logo_new.png";
export default { export default {
name: 'SidebarLogo', name: "SidebarLogo",
props: { props: {
collapse: { collapse: {
type: Boolean, type: Boolean,
@ -25,11 +30,11 @@ export default {
}, },
data() { data() {
return { return {
title: ' Transsion Future', title: "Aslan",
logo: logo logo: logo
} };
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -47,7 +52,8 @@ export default {
width: 100%; width: 100%;
height: 50px; height: 50px;
line-height: 50px; line-height: 50px;
background: #2b2f3a; background: linear-gradient(135deg, #342114 0%, #4a2c16 100%);
border-bottom: 1px solid rgba(255, 217, 167, 0.1);
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
@ -65,7 +71,8 @@ export default {
& .sidebar-title { & .sidebar-title {
display: inline-block; display: inline-block;
margin: 0; margin: 0;
color: #fff; margin-left: 4px;
color: #fff0dc;
font-weight: 600; font-weight: 600;
line-height: 50px; line-height: 50px;
font-size: 14px; font-size: 14px;

View File

@ -1,3 +1,3 @@
export { default as Navbar } from './Navbar' export { default as Navbar } from './NavbarLight'
export { default as Sidebar } from './Sidebar' export { default as Sidebar } from './Sidebar'
export { default as AppMain } from './AppMain' export { default as AppMain } from './AppMain'

View File

@ -45,7 +45,7 @@
.el-dropdown-link { .el-dropdown-link {
cursor: pointer; cursor: pointer;
color: #409EFF; color: #FF9326;
} }
.el-icon-arrow-down { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
@ -63,8 +63,8 @@
// 设置表头颜色 // 设置表头颜色
.el-table thead tr th{ .el-table thead tr th{
background:#fafafa !important; background:#FFF7ED !important;
color:#515a6e; color:#6E5138;
} }
.el-table th.el-table__cell.is-leaf, .el-table td.el-table__cell { .el-table th.el-table__cell.is-leaf, .el-table td.el-table__cell {
@ -168,6 +168,9 @@
bottom: 0px; bottom: 0px;
left: 0px; left: 0px;
right: 0px; right: 0px;
display: flex;
justify-content: flex-end;
gap: 12px;
background: #FFFFFF; background: #FFFFFF;
padding: 20px 50px; padding: 20px 50px;
z-index: 9; z-index: 9;
@ -185,3 +188,191 @@
width: 90px !important; width: 90px !important;
} }
.el-button {
border-radius: 12px;
font-weight: 500;
transition: all .2s ease;
}
.el-button + .el-button {
margin-left: 10px;
}
.el-button--primary {
border-color: #FF9326;
background: linear-gradient(135deg, #FF9326 0%, #FEB219 100%);
box-shadow: 0 10px 20px rgba(255, 147, 38, 0.22);
}
.el-button--primary:hover,
.el-button--primary:focus {
border-color: #FF9F3C;
background: linear-gradient(135deg, #FFA94D 0%, #FFC54A 100%);
box-shadow: 0 12px 24px rgba(255, 147, 38, 0.28);
}
.el-button--primary:active {
border-color: #F08414;
background: linear-gradient(135deg, #F08414 0%, #F5A900 100%);
}
.el-button--default {
border-color: rgba(255, 147, 38, 0.22);
color: #8C5B2A;
background-color: #FFF9F2;
}
.el-button--default:hover,
.el-button--default:focus {
border-color: #FFBE71;
color: #FF9326;
background-color: #FFF1E3;
}
.el-button--text {
color: #FF9326;
}
.el-button--text:hover,
.el-button--text:focus {
color: #E47E17;
}
.el-input__inner,
.el-textarea__inner,
.el-input-number,
.el-input-number__decrease,
.el-input-number__increase {
border-radius: 12px;
}
.el-input__inner:focus,
.el-textarea__inner:focus,
.el-select .el-input.is-focus .el-input__inner,
.el-date-editor.el-input__inner:focus,
.el-date-editor .el-input__inner:focus {
border-color: #FF9326;
box-shadow: 0 0 0 3px rgba(255, 147, 38, 0.12);
}
.el-select-dropdown,
.el-picker-panel,
.el-dropdown-menu,
.el-popover,
.el-cascader__dropdown,
.el-message-box {
border-radius: 16px;
border-color: rgba(255, 147, 38, 0.15);
box-shadow: 0 18px 40px rgba(89, 55, 18, 0.16);
}
.el-card,
.el-table,
.el-dialog,
.el-drawer,
.el-collapse-item__wrap,
.el-collapse-item__header {
border-radius: 18px;
}
.el-table,
.el-card {
border: 1px solid rgba(255, 147, 38, 0.12);
}
.el-table::before {
height: 0;
}
.el-dialog,
.el-message-box {
overflow: hidden;
border: 1px solid rgba(255, 147, 38, 0.15);
box-shadow: 0 24px 50px rgba(89, 55, 18, 0.18);
}
.el-dialog__header,
.el-message-box__header {
background: linear-gradient(180deg, #FFF8EF 0%, #FFFDFB 100%);
border-bottom: 1px solid rgba(255, 147, 38, 0.08);
}
.el-dialog__body,
.el-dialog__footer {
background: #FFFDFB;
}
.dialog-footer,
.drawer-footer {
display: flex;
justify-content: flex-end;
gap: 12px;
}
.dialog-footer .el-button + .el-button,
.drawer-footer .el-button + .el-button {
margin-left: 0;
}
.dialog-footer .el-button--primary,
.drawer-footer .el-button--primary {
order: -1;
}
.el-tabs__item {
color: #8C6D50;
}
.el-tabs__item:hover,
.el-tabs__item.is-active {
color: #FF9326;
}
.el-tabs__active-bar {
height: 3px;
border-radius: 999px;
background: linear-gradient(90deg, #FF9326 0%, #FEB219 100%);
}
.el-tabs__nav-wrap::after {
background-color: rgba(255, 147, 38, 0.12);
}
.el-radio__input.is-checked .el-radio__inner,
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner,
.el-switch.is-checked .el-switch__core {
border-color: #FF9326;
background-color: #FF9326;
}
.el-radio__input.is-checked + .el-radio__label,
.el-checkbox__input.is-checked + .el-checkbox__label {
color: #FF9326;
}
.el-checkbox__inner:hover,
.el-radio__inner:hover {
border-color: #FF9326;
}
.el-pagination.is-background .el-pager li:not(.disabled).active,
.el-pagination.is-background .btn-next,
.el-pagination.is-background .btn-prev {
border-radius: 10px;
}
.el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #FF9326;
}
.el-tag {
border-radius: 999px;
}
.el-backtop {
background: linear-gradient(135deg, #FF9326 0%, #FEB219 100%);
color: #FFFFFF;
box-shadow: 0 12px 28px rgba(255, 147, 38, 0.28);
}

View File

@ -4,20 +4,20 @@
**/ **/
/* theme color */ /* theme color */
$--color-primary: #1890ff; $--color-primary: #FF9326;
$--color-success: #13ce66; $--color-success: #28B779;
$--color-warning: #FFBA00; $--color-warning: #FEB219;
$--color-danger: #ff4949; $--color-danger: #F56C6C;
// $--color-info: #1E1E1E; // $--color-info: #1E1E1E;
$--button-font-weight: 400; $--button-font-weight: 400;
// $--color-text-regular: #1f2d3d; // $--color-text-regular: #1f2d3d;
$--border-color-light: #dfe4ed; $--border-color-light: #EEDCC8;
$--border-color-lighter: #e6ebf5; $--border-color-lighter: #F7EBDD;
$--table-border:1px solid#dfe6ec; $--table-border: 1px solid #EEDCC8;
// -------------- // --------------
// Font Color // Font Color
// $--color-text-primary: #E5EAF3; // $--color-text-primary: #E5EAF3;

View File

@ -7,13 +7,25 @@
@import './mark.scss'; @import './mark.scss';
@import './custom-dark.scss'; @import './custom-dark.scss';
:root {
--brand-primary: #ff9326;
--brand-primary-soft: #fff1df;
--brand-primary-pale: #fff8ef;
--brand-primary-border: rgba(255, 147, 38, 0.18);
--brand-primary-shadow: rgba(148, 84, 19, 0.16);
--brand-warning: #feb219;
--brand-text-main: #5d4632;
--brand-text-subtle: #8c6d50;
}
body { body {
height: 100%; height: 100%;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
font-size: 14px ; font-size: 14px;
color: var(--brand-text-main);
} }
label { label {
@ -29,6 +41,17 @@ html {
height: 100%; height: 100%;
} }
html:not(.dark-theme) body {
background:
radial-gradient(circle at top right, rgba(254, 178, 25, 0.2), transparent 24%),
radial-gradient(circle at left top, rgba(255, 147, 38, 0.12), transparent 18%),
linear-gradient(180deg, #fffaf4 0%, #f8efe5 100%);
}
html:not(.dark-theme) #app {
background: transparent;
}
*, *,
*:before, *:before,
*:after { *:after {
@ -68,14 +91,31 @@ div:focus {
padding: 20px; padding: 20px;
} }
html:not(.dark-theme) {
.app-container {
margin: 18px;
padding: 24px;
background: rgba(255, 252, 247, 0.92);
border: 1px solid var(--brand-primary-border);
border-radius: 24px;
box-shadow: 0 20px 45px var(--brand-primary-shadow);
backdrop-filter: blur(12px);
}
}
//条件过滤 //条件过滤
.filter-container { .filter-container {
padding-bottom: 10px; padding-bottom: 10px;
display: flex;
flex-wrap: wrap;
gap: 10px 12px;
align-items: center;
.filter-item { .filter-item {
display: inline-block; display: inline-flex;
align-items: center;
vertical-align: middle; vertical-align: middle;
margin-bottom: 10px; margin-bottom: 0;
} }
} }
@ -109,8 +149,8 @@ div:focus {
} }
.font-blue { .font-blue {
color: #409EFF; color: var(--brand-primary);
} }
/** /**
@ -188,7 +228,7 @@ flex 布局
line-height: 1.6; line-height: 1.6;
border-left: 5px solid $menuActiveText; border-left: 5px solid $menuActiveText;
border-radius: 0 2px 2px 0; border-radius: 0 2px 2px 0;
background-color: #FAFAFA; background-color: #FFFBF7;
} }
.blockquote-mini { .blockquote-mini {
padding: 10px !important; padding: 10px !important;
@ -216,9 +256,10 @@ flex 布局
margin: 3px 0px; margin: 3px 0px;
display: block; display: block;
padding: 5px 10px; padding: 5px 10px;
background-color: #f8f8f8; background-color: #FFFBF7;
color: #999; color: #8C6D50;
border-radius: 2px; border: 1px solid rgba(255, 147, 38, 0.12);
border-radius: 14px;
transition: all .3s; transition: all .3s;
-webkit-transition: all .3s; -webkit-transition: all .3s;
.block-card-title { .block-card-title {
@ -233,7 +274,7 @@ flex 布局
} }
} }
.block-card-selected { .block-card-selected {
background-color: #e3f2f1 !important; background-color: var(--brand-primary-soft) !important;
} }
@ -259,17 +300,18 @@ flex 布局
padding: 16px; padding: 16px;
height: auto; height: auto;
overflow: visible; overflow: visible;
background-color: #fafafa; background-color: #fffaf4;
border-radius: 5px; border: 1px solid rgba(255, 147, 38, 0.12);
border-radius: 16px;
} }
} }
.region-tag-color { .region-tag-color {
color: #333; color: #333;
background-color: #eaeff2; background-color: #fff1df;
} }
.region-tag-color:hover { .region-tag-color:hover {
background-color: #dfe9ee; background-color: #ffe4bf;
} }
.attached { .attached {
@ -277,3 +319,11 @@ flex 布局
border-radius: 10px; border-radius: 10px;
background-color: rgba(226, 215, 215, 0.3); background-color: rgba(226, 215, 215, 0.3);
} }
@media (max-width: 768px) {
html:not(.dark-theme) .app-container {
margin: 12px;
padding: 18px;
border-radius: 18px;
}
}

View File

@ -19,7 +19,8 @@
left: 0; left: 0;
z-index: 1001; z-index: 1001;
overflow: hidden; overflow: hidden;
box-shadow: 2px 0 6px rgba(0,21,41,.15); box-shadow: 10px 0 30px rgba(56, 33, 14, 0.28);
border-right: 1px solid rgba(255, 219, 185, 0.06);
// reset element-ui css // reset element-ui css
.horizontal-collapse-transition { .horizontal-collapse-transition {
transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out; transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
@ -61,6 +62,21 @@
border: none; border: none;
height: 100%; height: 100%;
width: 100% !important; width: 100% !important;
background: transparent;
}
.el-menu-item,
.el-submenu__title {
position: relative;
margin: 6px 12px;
width: calc(100% - 24px) !important;
border-radius: 14px;
transition: all .2s ease;
}
.el-menu-item:hover,
.el-submenu__title:hover {
transform: translateX(2px);
} }
// menu hover // menu hover
@ -84,6 +100,23 @@
background-color: $subMenuHover !important; background-color: $subMenuHover !important;
} }
} }
.el-menu-item.is-active,
.el-submenu.is-active > .el-submenu__title {
background: linear-gradient(135deg, rgba(255, 147, 38, 0.32), rgba(254, 178, 25, 0.18)) !important;
box-shadow: inset 0 0 0 1px rgba(255, 214, 160, 0.12), 0 10px 18px rgba(0, 0, 0, 0.16);
}
.el-menu-item.is-active::before {
content: '';
position: absolute;
left: 0;
top: 10px;
bottom: 10px;
width: 4px;
border-radius: 999px;
background: linear-gradient(180deg, #FF9326 0%, #FEB219 100%);
}
} }
.hideSidebar { .hideSidebar {
@ -98,12 +131,19 @@
.submenu-title-noDropdown { .submenu-title-noDropdown {
padding: 0 !important; padding: 0 !important;
position: relative; position: relative;
display: flex !important;
align-items: center;
justify-content: center;
.el-tooltip { .el-tooltip {
width: 100%;
padding: 0 !important; padding: 0 !important;
display: flex !important;
align-items: center;
justify-content: center;
.svg-icon { .svg-icon {
margin-left: 20px; margin: 0;
} }
} }
} }
@ -113,9 +153,12 @@
&>.el-submenu__title { &>.el-submenu__title {
padding: 0 !important; padding: 0 !important;
display: flex !important;
align-items: center;
justify-content: center;
.svg-icon { .svg-icon {
margin-left: 20px; margin: 0;
} }
.el-submenu__icon-arrow { .el-submenu__icon-arrow {

View File

@ -1,13 +1,13 @@
// sidebar // sidebar
$menuText:rgb(189, 189, 192); $menuText: #E8D3BE;
$menuActiveText:#409EFF; $menuActiveText: #FFF4E8;
$subMenuActiveText:rgb(189, 189, 192); //https://github.com/ElemeFE/element/issues/12951 $subMenuActiveText: #FFD9A7; // https://github.com/ElemeFE/element/issues/12951
$menuBg:#23232b; $menuBg: #24180F;
$menuHover:#282a34; $menuHover: #372316;
$subMenuBg:rgb(25, 26, 32); $subMenuBg: #1B120C;
$subMenuHover:#363945; $subMenuHover: #422A19;
$sideBarWidth: 210px; $sideBarWidth: 210px;

View File

@ -1,6 +1,6 @@
import defaultSettings from "@/settings"; import defaultSettings from "@/settings";
const title = defaultSettings.title || "atyou"; const title = defaultSettings.title || "Aslan";
export default function getPageTitle(pageTitle) { export default function getPageTitle(pageTitle) {
if (pageTitle) { if (pageTitle) {

View File

@ -3,11 +3,11 @@ import Cookies from 'js-cookie'
const adminThemeKey = 'admin-theme' const adminThemeKey = 'admin-theme'
export function getTheme() { export function getTheme() {
return Cookies.get(adminThemeKey) return 'normal'
} }
export function setTheme(theme) { export function setTheme(theme) {
return Cookies.set(adminThemeKey, theme) return Cookies.set(adminThemeKey, 'normal')
} }
export function removeTheme() { export function removeTheme() {
@ -19,20 +19,8 @@ export function removeTheme() {
*/ */
export function checkSwitchTheme() { export function checkSwitchTheme() {
try { try {
const theme = getTheme() setTheme('normal')
if (theme === 'normal') { document.documentElement.setAttribute('class', '')
document.documentElement.setAttribute('class', '')
return
}
if (theme === 'dark') {
document.documentElement.setAttribute('class', 'dark-theme')
return
}
const timeNow = new Date()
const hours = timeNow.getHours()
document.documentElement.setAttribute('class', (hours > 18 && hours <= 24) || (hours >= 0 && hours <= 6) ? 'dark-theme' : '')
} catch (er) { } catch (er) {
console.log('checkSwitchTheme', er) console.log('checkSwitchTheme', er)
} }

View File

@ -753,6 +753,6 @@ export default {
} }
} }
.selected-border { .selected-border {
border: 2px dashed #409EFF !important; border: 2px dashed #FF9326 !important;
} }
</style> </style>

View File

@ -51,7 +51,7 @@
<el-form-item prop="regionList" label="区域"> <el-form-item prop="regionList" label="区域">
<el-button <el-button
type="text" type="text"
style="margin-left: 10px; color: #409EFF;" style="margin-left: 10px; color: #FF9326;"
@click="handleSelectAllRegions" @click="handleSelectAllRegions"
> >
{{ isAllRegionsSelected ? "取消全选" : "全选" }} {{ isAllRegionsSelected ? "取消全选" : "全选" }}

View File

@ -147,11 +147,11 @@
</el-col> </el-col>
<el-col v-if="!item.unlimited" :span="10" style="text-align: center;"> <el-col v-if="!item.unlimited" :span="10" style="text-align: center;">
库存: {{ item.inStock }} 库存: {{ item.inStock }}
<i class="el-icon-edit cursor-pointer" style="color:#1890ff;" @click="clickInStockEdit(item)" /> <i class="el-icon-edit cursor-pointer" style="color:#FF9326;" @click="clickInStockEdit(item)" />
</el-col> </el-col>
<el-col v-if="!item.unlimited" :span="10" style="text-align: center;"> <el-col v-if="!item.unlimited" :span="10" style="text-align: center;">
消费: {{ item.consumeInStock }} 消费: {{ item.consumeInStock }}
<i class="el-icon-refresh-left cursor-pointer" style="color:#1890ff;" @click="clickRestConsumeInStock(item)" /> <i class="el-icon-refresh-left cursor-pointer" style="color:#FF9326;" @click="clickRestConsumeInStock(item)" />
</el-col> </el-col>
<div v-if="item.inStock < item.consumeInStock" class="font-danger"> <div v-if="item.inStock < item.consumeInStock" class="font-danger">
库存 &lt; 消费 点击保存系统会清理消费数重新计算 库存 &lt; 消费 点击保存系统会清理消费数重新计算

View File

@ -389,7 +389,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -146,7 +146,7 @@ export default {
.app-create { .app-create {
font-size: 26px; font-size: 26px;
font-weight: bold; font-weight: bold;
color: #409EFF; color: #FF9326;
} }
} }
} }

View File

@ -79,7 +79,7 @@
<el-card :body-style="{ padding: '15px' }"> <el-card :body-style="{ padding: '15px' }">
<div style="padding-bottom: 15px;"> <div style="padding-bottom: 15px;">
<span <span
style="color:#1890ff;font-weight: 600;line-height: 25px;" style="color:#FF9326;font-weight: 600;line-height: 25px;"
>动态内容: >动态内容:
</span> </span>
<div <div

View File

@ -957,7 +957,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -990,7 +990,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -490,7 +490,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -378,7 +378,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -1589,7 +1589,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409eff; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -914,7 +914,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -914,7 +914,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -14,8 +14,8 @@
<el-row v-for="(item, index) in list" :key="index"> <el-row v-for="(item, index) in list" :key="index">
<el-card style="margin: 20px;"> <el-card style="margin: 20px;">
<div style="padding: 0px; word-wrap: break-word;"> <div style="padding: 0px; word-wrap: break-word;">
<div><span style="font-weight: 600;color:#1890ff">标题: </span>{{ item.title }}</div> <div><span style="font-weight: 600;color:#FF9326">标题: </span>{{ item.title }}</div>
<div style="margin-top: 10px;"><span style="font-weight: 600;color:#1890ff">内容: </span>{{ item.content }} <div style="margin-top: 10px;"><span style="font-weight: 600;color:#FF9326">内容: </span>{{ item.content }}
<el-image <el-image
v-if="item.cover" v-if="item.cover"
class="image" class="image"

View File

@ -149,7 +149,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -213,7 +213,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -5,7 +5,7 @@
v-model="listQuery.sysOrigin" v-model="listQuery.sysOrigin"
placeholder="系统" placeholder="系统"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--system"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -25,7 +25,7 @@
v-model="listQuery.h5Display" v-model="listQuery.h5Display"
placeholder="显示状态" placeholder="显示状态"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--display"
clearable clearable
@change="handleSearch" @change="handleSearch"
> >
@ -36,7 +36,7 @@
v-model="listQuery.dealer" v-model="listQuery.dealer"
placeholder="是否经销商" placeholder="是否经销商"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--dealer"
clearable clearable
@change="handleSearch" @change="handleSearch"
> >
@ -48,7 +48,7 @@
v-model="listQuery.close" v-model="listQuery.close"
placeholder="状态" placeholder="状态"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--status"
clearable clearable
@change="handleSearch" @change="handleSearch"
> >
@ -62,7 +62,7 @@
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item"
/> --> /> -->
<div class="filter-item"> <div class="filter-item filter-item--user">
<account-input <account-input
v-model="listQuery.userId" v-model="listQuery.userId"
:sys-origin="listQuery.sysOrigin" :sys-origin="listQuery.sysOrigin"
@ -70,7 +70,7 @@
/> />
</div> </div>
<el-button <el-button
class="filter-item" class="filter-item filter-item--search"
type="primary" type="primary"
icon="el-icon-search" icon="el-icon-search"
:disabled="searchDisabled" :disabled="searchDisabled"
@ -79,7 +79,7 @@
搜索 搜索
</el-button> </el-button>
<el-button <el-button
class="filter-item" class="filter-item filter-item--create"
type="primary" type="primary"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleCreate" @click="handleCreate"
@ -646,3 +646,33 @@ export default {
} }
}; };
</script> </script>
<style scoped lang="scss">
.filter-item--system {
order: 10;
}
.filter-item--user {
order: 20;
}
.filter-item--status {
order: 30;
}
.filter-item--display {
order: 40;
}
.filter-item--dealer {
order: 50;
}
.filter-item--search {
order: 60;
}
.filter-item--create {
order: 70;
}
</style>

View File

@ -153,7 +153,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -184,7 +184,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -184,7 +184,7 @@ export default {
} }
.save { .save {
font-size: 30px; font-size: 30px;
color: #409EFF; color: #FF9326;
cursor: pointer; cursor: pointer;
} }
} }

View File

@ -4,7 +4,7 @@
<el-select <el-select
v-model="listQuery.del" v-model="listQuery.del"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--status"
@change="handleSearch" @change="handleSearch"
> >
<el-option label="未注销" value="0" /> <el-option label="未注销" value="0" />
@ -14,7 +14,7 @@
v-model="listQuery.sysOrigins" v-model="listQuery.sysOrigins"
placeholder="系统" placeholder="系统"
style="width: 200px" style="width: 200px"
class="filter-item" class="filter-item filter-item--system"
multiple multiple
collapse-tags collapse-tags
> >
@ -36,7 +36,7 @@
placeholder="注册来源" placeholder="注册来源"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--register-origin"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -52,7 +52,7 @@
placeholder="来源平台" placeholder="来源平台"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--origin-platform"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -69,7 +69,7 @@
placeholder="性别" placeholder="性别"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--gender"
@change="handleUserSexChange" @change="handleUserSexChange"
> >
<el-option <el-option
@ -86,7 +86,7 @@
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
placeholder="国家" placeholder="国家"
style="width: 200px" style="width: 200px"
class="filter-item" class="filter-item filter-item--country"
clearable clearable
@clear="handleDelCountryCodeClick" @clear="handleDelCountryCodeClick"
@select="handleCountryCodeClick" @select="handleCountryCodeClick"
@ -108,7 +108,7 @@
placeholder="账号类型" placeholder="账号类型"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--user-type"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -118,7 +118,7 @@
:value="item.value" :value="item.value"
/> />
</el-select> </el-select>
<div class="filter-item"> <div class="filter-item filter-item--date">
<el-date-picker <el-date-picker
v-model="rangeDate" v-model="rangeDate"
value-format="timestamp" value-format="timestamp"
@ -134,35 +134,35 @@
v-number v-number
placeholder="长UID" placeholder="长UID"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item filter-item--long-id"
/> />
<el-input <el-input
v-model.trim="listQuery.account" v-model.trim="listQuery.account"
placeholder="短账号" placeholder="短账号"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item filter-item--short-id"
/> />
<el-input <el-input
v-model.trim="listQuery.deviceId" v-model.trim="listQuery.deviceId"
placeholder="设备ID" placeholder="设备ID"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item filter-item--device-id"
/> />
<el-button <el-button
:loading="searchLoading" :loading="searchLoading"
class="filter-item" class="filter-item filter-item--search"
type="primary" type="primary"
icon="el-icon-search" icon="el-icon-search"
@click="handleSearch" @click="handleSearch"
> >
搜索 搜索
</el-button> </el-button>
<el-checkbox v-model="showAllCondition" class="filter-item" <el-checkbox v-model="showAllCondition" class="filter-item filter-item--toggle"
>显示所有条件</el-checkbox >显示所有条件</el-checkbox
> >
<el-button <el-button
v-if="buttonPermissions.includes('props:config:sales:total')" v-if="buttonPermissions.includes('props:config:sales:total')"
class="filter-item" class="filter-item filter-item--overview"
type="primary" type="primary"
icon="el-icon-monitor" icon="el-icon-monitor"
@click="clickUserRegistrationOverview" @click="clickUserRegistrationOverview"
@ -1038,4 +1038,60 @@ export default {
width: 150px; width: 150px;
} }
} }
.filter-item--system {
order: 10;
}
.filter-item--country {
order: 20;
}
.filter-item--long-id {
order: 30;
}
.filter-item--short-id {
order: 40;
}
.filter-item--device-id {
order: 50;
}
.filter-item--status {
order: 60;
}
.filter-item--user-type {
order: 70;
}
.filter-item--gender {
order: 80;
}
.filter-item--register-origin {
order: 90;
}
.filter-item--origin-platform {
order: 100;
}
.filter-item--date {
order: 110;
}
.filter-item--toggle {
order: 120;
}
.filter-item--search {
order: 130;
}
.filter-item--overview {
order: 140;
}
</style> </style>

View File

@ -7,7 +7,7 @@
<el-select <el-select
v-model="listQuery.del" v-model="listQuery.del"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--status"
@change="handleSearch" @change="handleSearch"
> >
<el-option label="未注销" value="0" /> <el-option label="未注销" value="0" />
@ -19,7 +19,7 @@
v-model="listQuery.sysOrigins" v-model="listQuery.sysOrigins"
placeholder="系统" placeholder="系统"
style="width: 200px" style="width: 200px"
class="filter-item" class="filter-item filter-item--system"
multiple multiple
collapse-tags collapse-tags
> >
@ -43,7 +43,7 @@
placeholder="注册来源" placeholder="注册来源"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--register-origin"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -61,7 +61,7 @@
placeholder="来源平台" placeholder="来源平台"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--origin-platform"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -79,7 +79,7 @@
placeholder="性别" placeholder="性别"
clearable clearable
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--gender"
@change="handleUserSexChange" @change="handleUserSexChange"
> >
<el-option <el-option
@ -98,7 +98,7 @@
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
placeholder="国家" placeholder="国家"
style="width: 200px" style="width: 200px"
class="filter-item" class="filter-item filter-item--country"
clearable clearable
@clear="handleDelCountryCodeClick" @clear="handleDelCountryCodeClick"
@select="handleCountryCodeClick" @select="handleCountryCodeClick"
@ -121,7 +121,7 @@
v-loading="loadingCountry" v-loading="loadingCountry"
placeholder="国家" placeholder="国家"
style="width: 200px" style="width: 200px"
class="filter-item" class="filter-item filter-item--user-type"
clearable clearable
collapse-tags collapse-tags
@change="changeCountry" @change="changeCountry"
@ -160,7 +160,7 @@
</el-select> </el-select>
<!-- 注册时间 --> <!-- 注册时间 -->
<div class="filter-item"> <div class="filter-item filter-item--date">
<el-date-picker <el-date-picker
v-model="rangeDate" v-model="rangeDate"
value-format="timestamp" value-format="timestamp"
@ -178,7 +178,7 @@
v-number v-number
placeholder="长UID" placeholder="长UID"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item filter-item--long-id"
/> />
<!-- 短账号 --> <!-- 短账号 -->
@ -186,7 +186,7 @@
v-model.trim="listQuery.account" v-model.trim="listQuery.account"
placeholder="短账号" placeholder="短账号"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item filter-item--short-id"
/> />
<!-- 设备ID --> <!-- 设备ID -->
@ -194,13 +194,13 @@
v-model.trim="listQuery.deviceId" v-model.trim="listQuery.deviceId"
placeholder="设备ID" placeholder="设备ID"
style="width: 200px;" style="width: 200px;"
class="filter-item" class="filter-item filter-item--device-id"
/> />
<!-- 搜索按钮 --> <!-- 搜索按钮 -->
<el-button <el-button
:loading="searchLoading" :loading="searchLoading"
class="filter-item" class="filter-item filter-item--search"
type="primary" type="primary"
icon="el-icon-search" icon="el-icon-search"
@click="handleSearch" @click="handleSearch"
@ -209,14 +209,14 @@
</el-button> </el-button>
<!-- 是否显示所有条件 --> <!-- 是否显示所有条件 -->
<el-checkbox v-model="showAllCondition" class="filter-item" <el-checkbox v-model="showAllCondition" class="filter-item filter-item--toggle"
>显示所有条件</el-checkbox >显示所有条件</el-checkbox
> >
<!-- 用户注册情况 --> <!-- 用户注册情况 -->
<el-button <el-button
v-if="buttonPermissions.includes('props:config:sales:total')" v-if="buttonPermissions.includes('props:config:sales:total')"
class="filter-item" class="filter-item filter-item--overview"
type="primary" type="primary"
icon="el-icon-monitor" icon="el-icon-monitor"
@click="clickUserRegistrationOverview" @click="clickUserRegistrationOverview"
@ -1327,4 +1327,60 @@ export default {
width: 150px; width: 150px;
} }
} }
.filter-item--system {
order: 10;
}
.filter-item--country {
order: 20;
}
.filter-item--long-id {
order: 30;
}
.filter-item--short-id {
order: 40;
}
.filter-item--device-id {
order: 50;
}
.filter-item--status {
order: 60;
}
.filter-item--user-type {
order: 70;
}
.filter-item--gender {
order: 80;
}
.filter-item--register-origin {
order: 90;
}
.filter-item--origin-platform {
order: 100;
}
.filter-item--date {
order: 110;
}
.filter-item--toggle {
order: 120;
}
.filter-item--search {
order: 130;
}
.filter-item--overview {
order: 140;
}
</style> </style>

View File

@ -6,7 +6,7 @@
v-model="listQuery.sysOrigin" v-model="listQuery.sysOrigin"
placeholder="系统" placeholder="系统"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--system"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -22,7 +22,7 @@
<el-select <el-select
v-model="listQuery.platform" v-model="listQuery.platform"
style="width: 120px" style="width: 120px"
class="filter-item" class="filter-item filter-item--platform"
placeholder="平台" placeholder="平台"
@change="changeSelectPlatform" @change="changeSelectPlatform"
> >
@ -38,7 +38,7 @@
v-model="listQuery.channel" v-model="listQuery.channel"
placeholder="渠道" placeholder="渠道"
style="width: 200px" style="width: 200px"
class="filter-item" class="filter-item filter-item--channel"
@change="handleSearch" @change="handleSearch"
> >
<el-option <el-option
@ -50,7 +50,7 @@
</el-select> </el-select>
<el-button <el-button
:loading="searchLoading" :loading="searchLoading"
class="filter-item" class="filter-item filter-item--search"
type="primary" type="primary"
icon="el-icon-search" icon="el-icon-search"
@click="handleSearch" @click="handleSearch"
@ -58,7 +58,7 @@
搜索 搜索
</el-button> </el-button>
<el-button <el-button
class="filter-item" class="filter-item filter-item--create"
style="margin-left: 10px;" style="margin-left: 10px;"
type="primary" type="primary"
icon="el-icon-edit" icon="el-icon-edit"
@ -72,13 +72,13 @@
ref="saveTagInput" ref="saveTagInput"
v-model="buildVersion" v-model="buildVersion"
v-number v-number
class="filter-item input-new-tag" class="filter-item filter-item--build-version input-new-tag"
@blur="handleInputConfirm" @blur="handleInputConfirm"
/> />
<el-button <el-button
v-else v-else
v-loading="buildVersionLoading" v-loading="buildVersionLoading"
class="filter-item button-new-tag" class="filter-item filter-item--build-version button-new-tag"
type="info" type="info"
plain plain
@click="showBuildVersionInput" @click="showBuildVersionInput"
@ -373,6 +373,31 @@ export default {
width: 150px; width: 150px;
} }
} }
.filter-item--system {
order: 10;
}
.filter-item--platform {
order: 20;
}
.filter-item--channel {
order: 30;
}
.filter-item--build-version {
order: 40;
}
.filter-item--search {
order: 50;
}
.filter-item--create {
order: 60;
}
.el-tag + .el-tag { .el-tag + .el-tag {
margin-left: 10px; margin-left: 10px;
} }