Skip to content

E
evm-store
Commit 7807af36 authored by wanli's avatar wanli
Browse files
Options

🐞 fix(前端布局HEADER): 修复前端布局bug

parent 092b6221
Hide whitespace changes
Inline Side-by-side
Showing with 250 additions and 181 deletions
tools/build_out/controllers/app.py
View file @ 7807af36
......@@ -111,17 +111,16 @@ class AppResource(object):
return { 'app_name': app.app_name, 'app_path': epk_path }, ResponseCode.HTTP_SUCCESS
def getList(self, params, jwt):
# 默认只查询资源包
user = UserModel.query.filter(UserModel.uuid==jwt.get('uuid')).one_or_none()
if not user:
return False, ResponseCode.USER_NOT_EXISTS
temp = {}
temp = { "is_delete": False }
filters = [AppModel.is_delete==False]
if user.role == 1:
temp.update({ "is_delete": False })
else:
if user.role != 1:
filters.append(AppModel.create_by==user.id)
temp.update({ "create_by": user.id, "is_delete": False })
temp.update({ "create_by": user.id })
if "scope" in params and params.get("scope") == "list":
result = AppModel.query.filter_by(**temp).order_by(AppModel.create_at.desc())
......@@ -145,7 +144,6 @@ class AppResource(object):
result = AppModel.query.filter_by(**temp).order_by(AppModel.create_at.desc()).paginate(params.get("page", 1), params.get("pageSize", 15), error_out=False)
# result = AppModel.query.filter(*filters).order_by(AppModel.create_at.desc()).paginate(params.get('page', 1), params.get('pageSize', 15), error_out=False)
if result.total and len(result.items):
return result, ResponseCode.HTTP_SUCCESS
return None, ResponseCode.HTTP_NOT_FOUND
......
tools/frontend/src/components/SettingDrawer/index.js
View file @ 7807af36
......@@ -2,8 +2,9 @@ import "./index.less";
import ThemeColor from "./ThemeColor";
import BlockChecbox from "./BlockChecbox";
import Vue from 'vue';
import { Drawer, Modal, Divider, message } from "ant-design-vue";
import { Drawer, Modal, Divider, Switch, Radio, message } from "ant-design-vue";
import { mapGetters } from "vuex";
const Body = {
props: ["title"],
render: function render() {
......@@ -18,6 +19,8 @@ const Body = {
Vue.use(Drawer)
Vue.use(Modal)
Vue.use(Switch)
Vue.use(Radio)
const SettingDrawer = {
// data: () => ({
......@@ -39,18 +42,20 @@ const SettingDrawer = {
nextState.contentWidth = value === "topmenu" ? "Fixed" : "Fluid";
}
else if (key === 'fixedHeader' && !value) {
nextState.autoHideHeader = false;
nextState.autoHideHeader = false;
}
// console.log(this.settings);
// console.log(nextState);
this.$store.commit('global/UpdateDefaultSettings', this.s)
this.$store.commit('global/UpdateDefaultSettings', nextState)
console.log(key);
console.log(value);
nextState.config = true;
this.$store.commit('global/UpdateDefaultSettings', this.settings);
this.$store.commit('global/UpdateDefaultSettings', nextState);
message.loading("正在编译主题！", 3);
this.$store.dispatch("global/defaultSettings", true);
},
onChange(checked) {
console.log(`a-switch to ${checked}`);
},
togglerContent() {
this.$parent.collapse = !this.collapse;
......@@ -61,7 +66,7 @@ const SettingDrawer = {
const { primaryColor, layout, navTheme } = this.settings;
return (
<Drawer
title="我是一个抽屉"
title="界面设置"
placement="right"
closable={false}
onClose={this.togglerContent}
......@@ -127,7 +132,38 @@ const SettingDrawer = {
</Body>
<Divider />
<p>其它设置</p>
<h3 class="setting-title">其它设置</h3>
<div class="setting-item">
<p>内容区域宽度</p>
<a-radio-group size="small" default-value="Fluid" button-style="solid" onChange={(e) => {
this.changeSetting("contentWidth", e.target.value);
}}>
<a-radio-button value="Fluid">
流式
</a-radio-button>
<a-radio-button value="Fixed">
固定
</a-radio-button>
</a-radio-group>
</div>
<div class="setting-item">
<p>固定HEADER</p>
<a-switch size="small" default-checked onChange={(e) => {
this.changeSetting("fixedHeader", e);
}} />
</div>
<div class="setting-item">
<p>自动隐藏HEADER</p>
<a-switch size="small" default-checked onChange={(e) => {
this.changeSetting("autoHideHeader", e);
}} />
</div>
<div class="setting-item">
<p>固定侧边栏</p>
<a-switch size="small" default-checked onChange={(e) => {
this.changeSetting("fixSiderbar", e);
}} />
</div>
</div>
</Drawer>
);
......
tools/frontend/src/components/SettingDrawer/index.less
View file @ 7807af36
@import 'ant-design-vue/lib/style/themes/default.less';
@import "ant-design-vue/lib/style/themes/default.less";
.setting-drawer{
.setting-drawer {
&.content {
min-height: 100%;
background: #fff;
position: relative;
}
& > h3.setting-title {
margin-bottom: 15px;
}
&.content {
min-height: 100%;
background: #fff;
position: relative;
}
& > div.setting-item {
display: flex;
flex-direction: row;
justify-content: space-between;
}
.blockChecbox {
display: flex;
.item {
margin-right: 16px;
position: relative;
// box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
border-radius: @border-radius-base;
cursor: pointer;
img {
width: 48px;
.blockChecbox {
display: flex;
.item {
margin-right: 16px;
position: relative;
// box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
border-radius: @border-radius-base;
cursor: pointer;
img {
width: 48px;
}
}
.selectIcon {
position: absolute;
top: 0;
right: 0;
width: 100%;
padding-top: 15px;
padding-left: 24px;
height: 100%;
color: @primary-color;
font-size: 14px;
font-weight: bold;
}
}
.selectIcon {
position: absolute;
top: 0;
right: 0;
width: 100%;
padding-top: 15px;
padding-left: 24px;
height: 100%;
color: @primary-color;
font-size: 14px;
font-weight: bold;
}
}
.color_block {
width: 38px;
height: 22px;
margin: 4px;
border-radius: 4px;
cursor: pointer;
margin-right: 12px;
display: inline-block;
vertical-align: middle;
}
.colorBlock {
width: 38px;
height: 22px;
margin: 4px;
border-radius: 4px;
cursor: pointer;
margin-right: 12px;
display: inline-block;
vertical-align: middle;
}
.title {
font-size: 14px;
color: @heading-color;
line-height: 22px;
margin-bottom: 12px;
}
.title {
font-size: 14px;
color: @heading-color;
line-height: 22px;
margin-bottom: 12px;
}
.handle {
position: absolute;
top: 240px;
background: @primary-color;
width: 48px;
height: 48px;
right: 300px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
pointer-events: auto;
z-index: 0;
text-align: center;
font-size: 16px;
border-radius: 4px 0 0 4px;
}
.handle {
position: absolute;
top: 240px;
background: @primary-color;
width: 48px;
height: 48px;
right: 300px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
pointer-events: auto;
z-index: 0;
text-align: center;
font-size: 16px;
border-radius: 4px 0 0 4px;
}
.productionHint {
font-size: 12px;
margin-top: 16px;
}
.productionHint {
font-size: 12px;
margin-top: 16px;
}
}
tools/frontend/src/defaultSettings.js
View file @ 7807af36
/*
* @Author: your name
* @Date: 2021-07-15 09:33:39
* @LastEditTime: 2021-07-22 23:16:09
* @LastEditTime: 2021-07-23 10:58:39
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \evm-store\tools\frontend\src\defaultSettings.js
......@@ -9,9 +9,9 @@
export default {
navTheme: 'dark', // theme for nav menu
primaryColor: '#1890FF', // primary color of ant design
layout: 'sidemenu', // nav menu position: sidemenu or topmenu
layout: 'topmenu', // nav menu position: sidemenu or topmenu
contentWidth: 'Fluid', // layout of content: Fluid or Fixed, only works when layout is topmenu
fixedHeader: false, // sticky header
fixedHeader: true, // sticky header
autoHideHeader: false, // auto hide header
fixSiderbar: false, // sticky siderbar
leftMenuTitle: "EVM 应用商店", // 左侧边栏顶部名称
......
tools/frontend/src/layouts/Header.js
View file @ 7807af36
import './Header.less'
import "./Header.less";
import { Layout } from "ant-design-vue";
import GlobalHeader from '@/components/GlobalHeader';
import TopNavHeader from '@/components/TopNavHeader';
import GlobalHeader from "@/components/GlobalHeader";
import TopNavHeader from "@/components/TopNavHeader";
import { mapGetters } from "vuex";
const { Header } = Layout;
const HeaderView = {
props: ['menuData', 'logo'],
computed: {
...mapGetters({
settings: "global/settings"
})
props: ["menuData", "logo"],
computed: {
...mapGetters({
settings: "global/settings",
collapsed: "global/getChangeLayoutCollapsed",
}),
sideMenuWidth() {
return this.collapsed ? "80px" : "256px";
},
render() {
const { menuData, logo } = this
const { layout, navTheme, fixedHeader, leftMenuTitle } = this.settings;
const isTop = layout === 'topmenu';
const isMobile = false;
headerStyle() {
const { layout, fixedHeader } = this.settings;
return (
<Header style={{ padding: 0 }} class={fixedHeader ? 'fixedHeader' : ''}>
{isTop && !isMobile ? (
// <TopNavHeader
// theme={navTheme}
// mode="horizontal"
// Authorized={Authorized}
// onCollapse={handleMenuCollapse}
// onNoticeClear={this.handleNoticeClear}
// onMenuClick={this.handleMenuClick}
// onNoticeVisibleChange={this.handleNoticeVisibleChange}
// {...this.props}
// />
<TopNavHeader
theme={navTheme}
layout={layout}
mode="horizontal"
menuData={menuData}
logo={logo}
title={leftMenuTitle}
/>
) : (
// <GlobalHeader
// onCollapse={handleMenuCollapse}
// onNoticeClear={this.handleNoticeClear}
// onMenuClick={this.handleMenuClick}
// onNoticeVisibleChange={this.handleNoticeVisibleChange}
// {...this.props}
// />
<GlobalHeader theme={navTheme} layout={layout}/>
)}
</Header>
);
}
}
let width =
fixedHeader && layout !== "topmenu"
? `calc(100% - ${this.sideMenuWidth})`
: "100%";
let position = fixedHeader ? "fixed" : "static";
return `width: ${width};position: ${position};top: 0;z-index: 1061;transition: width 0.2s;padding: 0;`;
},
},
render() {
const { menuData, logo } = this;
const { layout, navTheme, fixedHeader, leftMenuTitle } = this.settings;
const isTop = layout === "topmenu";
const isMobile = false;
return (
<div>
<Header style={this.headerStyle}>
{isTop && !isMobile ? (
// <TopNavHeader
// theme={navTheme}
// mode="horizontal"
// Authorized={Authorized}
// onCollapse={handleMenuCollapse}
// onNoticeClear={this.handleNoticeClear}
// onMenuClick={this.handleMenuClick}
// onNoticeVisibleChange={this.handleNoticeVisibleChange}
// {...this.props}
// />
<TopNavHeader
theme={navTheme}
layout={layout}
mode="horizontal"
menuData={menuData}
logo={logo}
title={leftMenuTitle}
/>
) : (
// <GlobalHeader
// onCollapse={handleMenuCollapse}
// onNoticeClear={this.handleNoticeClear}
// onMenuClick={this.handleMenuClick}
// onNoticeVisibleChange={this.handleNoticeVisibleChange}
// {...this.props}
// />
<GlobalHeader theme={navTheme} layout={layout} />
)}
</Header>
<div v-show={fixedHeader} class="placeholder-element" />
</div>
);
},
};
export default HeaderView;
tools/frontend/src/layouts/Header.less
View file @ 7807af36
.fixedHeader {
position: fixed;
top: 0;
width: 100%;
// > @zindex-tooltip
z-index: 1061;
transition: width 0.2s;
}
\ No newline at end of file
position: fixed;
top: 0;
width: 100%;
// > @zindex-tooltip
z-index: 1061;
transition: width 0.2s;
}
.placeholder-element {
width: 100%;
height: 64px;
}
\ No newline at end of file
tools/frontend/src/layouts/UserLayout.js
View file @ 7807af36
import './UserLayout.less'
import logo from '@/assets/app-store.svg';
import "./UserLayout.less";
import logo from "@/assets/app-store.svg";
import { mapGetters } from "vuex";
const UserLayout = {
props: {
logo: { default: logo, types: String }
logo: { default: logo, types: String },
},
computed: {
...mapGetters({
settings: "global/settings"
})
},
settings: "global/settings",
}),
},
render() {
const { leftMenuTitle, appSlogan } = this.settings;
......@@ -19,18 +19,14 @@ const UserLayout = {
<div class="top">
<div class="header">
<img alt="logo" class="logo" src={this.logo} />
<span class="title">
{leftMenuTitle}
</span>
</div>
<div class="desc">
{appSlogan}
<span class="title">{leftMenuTitle}</span>
</div>
<div class="desc">{appSlogan}</div>
</div>
<router-view />
</div>
</div>
)
}
}
export default UserLayout
\ No newline at end of file
);
},
};
export default UserLayout;
tools/frontend/src/locales/zh_CN.js
View file @ 7807af36
......@@ -66,7 +66,7 @@ export default {
'app.analysis.day-sales': '今日新增',
'app.analysis.visits': '打包总数',
'app.analysis.visits-trend': '访问量趋势',
'app.analysis.visits-ranking': '门店访问量排名',
'app.analysis.visits-ranking': '开发者打包排名',
'app.analysis.day-visits': '今日新增',
'app.analysis.week': '周同比',
'app.analysis.day': '今日新增',
......@@ -74,7 +74,7 @@ export default {
'app.analysis.conversion-rate': '今日新增',
'app.analysis.operational-effect': '设备总数',
'app.analysis.sales-trend': '销售趋势',
'app.analysis.sales-ranking': '门店销售额排名',
'app.analysis.sales-ranking': '开发者应用排名',
'app.analysis.all-year': '全年',
'app.analysis.all-month': '本月',
'app.analysis.all-week': '本周',
......@@ -86,7 +86,7 @@ export default {
'app.analysis.channel.all': '全部渠道',
'app.analysis.channel.online': '线上',
'app.analysis.channel.stores': '门店',
'app.analysis.sales': '销售额',
'app.analysis.sales': '累计汇总',
'app.analysis.traffic': '客流量',
'app.analysis.table.rank': '排名',
'app.analysis.table.search-keyword': '搜索关键词',
......
tools/frontend/src/router/index.js
View file @ 7807af36
......@@ -10,6 +10,10 @@ Vue.use(Router);
const router = new Router({
routes: [
{
path: "/login",
redirect: "/user/login",
},
// user
{
path: "/user",
......@@ -171,7 +175,6 @@ const router = new Router({
path: "/application",
icon: "shop",
name: "application",
// redirect: '/application/index',
component: BasicLayout,
children: [
{ path: "/application", redirect: "/application/index" },
......
tools/frontend/src/store/modules/global-nav.js
View file @ 7807af36
......@@ -159,7 +159,6 @@ const state = {
const actions = {
["getMenuNav"]({ commit, state }, config) {
state.loading = true;
console.log(config)
return new Promise((resolve, reject) => {
menuNav()
.then((response) => {
......
tools/frontend/src/store/modules/global.js
View file @ 7807af36
/*
* @Author: your name
* @Date: 2021-07-15 09:33:39
* @LastEditTime: 2021-07-23 11:59:08
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \evm-store\tools\frontend\src\store\modules\global.js
*/
const state = {
defaultSettings: {},
BasicLayoutSpinning: true,
......@@ -36,8 +44,8 @@ const mutations = {
state.ChangeLayoutCollapsed = payload;
},
["UpdateDefaultSettings"](state, payload) {
let localSettingsKey = "_settings";
if (payload.config === true) {
const localSettingsKey = "_settings";
if (payload.config && payload.config === true) {
window.localStorage.setItem(
localSettingsKey,
JSON.stringify(state.defaultSettings)
......
tools/frontend/src/views/Application/Index.vue
View file @ 7807af36
......@@ -218,7 +218,7 @@
<p :style="[sya, syb]">
<a-avatar :src="record.app_icon" shape="square" :size="128" />
</p>
<p :style="[sya]">Personal</p>
<p :style="[sya]">详细信息</p>
<a-row>
<a-col :span="6">
<a-description-item
......@@ -247,7 +247,7 @@
</a-row>
<a-row>
<a-col :span="6">
<a-description-item title="Country" :content="record.nat" />
<a-description-item title="启动页" :content="record.launcher" />
</a-col>
<a-col :span="6">
<a-description-item
......
tools/frontend/src/views/Dashboard/Analysis.vue
View file @ 7807af36
......@@ -28,11 +28,11 @@
/>
<a-trend flag="up" :style="{ marginRight: '16px' }">
{{ $t("app.analysis.week") }}
<span class="trendText">12%</span>
<span class="trendText">0%</span>
</a-trend>
<a-trend flag="down">
{{ $t("app.analysis.day") }}
<span class="trendText">11%</span>
<span class="trendText">0%</span>
</a-trend>
</a-chart-card>
</a-col>
......@@ -64,11 +64,11 @@
<!-- <a-mini-area color="#975FE4" /> -->
<a-trend flag="up" :style="{ marginRight: '16px' }">
{{ $t("app.analysis.week") }}
<span class="trendText">6%</span>
<span class="trendText">0%</span>
</a-trend>
<a-trend flag="down">
{{ $t("app.analysis.day") }}
<span class="trendText">2%</span>
<span class="trendText">0%</span>
</a-trend>
</a-chart-card>
</a-col>
......@@ -181,23 +181,23 @@
<a-row>
<a-col :md="6" :sm="12" :xs="24">
<a-number-info
subTitle="今日交易总额"
suffix="万元"
:total="numeral(12233).format('0,0')"
subTitle="今日访问"
suffix="次"
:total="numeral(0).format('0,0')"
/>
</a-col>
<a-col :md="6" :sm="12" :xs="24">
<a-number-info subTitle="销售目标完成率" total="92%" />
<a-number-info subTitle="未定义指标" total="0%" />
</a-col>
<a-col :md="6" :sm="12" :xs="24">
<!-- <NumberInfo subTitle="活动剩余时间" total={<CountDown target={targetTime} />} /> -->
<a-number-info subTitle="活动剩余时间" total="01:04:53" />
<a-number-info subTitle="最新下载时间" total="00:00:00" />
</a-col>
<a-col :md="6" :sm="12" :xs="24">
<a-number-info
subTitle="每秒交易总额"
suffix="元"
:total="numeral(21234).format('0,0')"
subTitle="每秒访问"
suffix="次"
:total="numeral(0).format('0,0')"
/>
</a-col>
</a-row>
......@@ -225,7 +225,7 @@
{{ i + 1 }}
</span>
<span class="rankingItemTitle">
中国 🇨🇳 加油 ⛽️ ⛽ ️⛽️
暂无数据 ⛽️ ⛽ ️⛽️
</span>
<span class="rankingItemValue"> 0,0 </span>
</li>
......
tools/frontend/vue.config.js
View file @ 7807af36
/*
* @Author: your name
* @Date: 2021-07-15 09:33:39
* @LastEditTime: 2021-07-22 03:35:46
* @LastEditTime: 2021-07-23 10:28:29
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \evm-store\tools\frontend\vue.config.js
......@@ -32,7 +32,7 @@ module.exports = {
// change xxx-api/login => mock/login
// detail: https://cli.vuejs.org/config/#devserver-proxy
"/api/v1": {
target: "http://127.0.0.1:3000/",
target: "http://lab.wanliwuhan.com/",
changeOrigin: true,
pathRewrite: {},
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment