Skip to content

Q
quantum-blocks-h5
Commit e7edd6c9 authored by 郝聪敏's avatar 郝聪敏
Browse files
Options

feature: 修改bug

parent da65dad3
Show whitespace changes
Inline Side-by-side
Showing with 94 additions and 71 deletions
app/web/asset/css/reset.css
View file @ e7edd6c9
......@@ -145,3 +145,34 @@ li {
*:after {
box-sizing: border-box;
}
/* 自定义 */
html {
font-size: 10vw !important;
}
html,
body,
#app {
height: 100%;
}
.cr-popup .cr-notify {
font-size: 14px;
}
.cr-toast .cr-toast--inner {
box-sizing: content-box;
}
@media screen and (min-width: 768Px) {
html {
font-size: 37.5Px !important;
}
body {
max-width: 375Px;
max-height: 667Px;
margin: 0 auto !important;
}
}
app/web/component/layout/activity/index.vue
View file @ e7edd6c9
......@@ -17,19 +17,4 @@
</html>
<div v-else-if="!isNode" id="app"><slot></slot></div>
</template>
<style>
html {
font-size: 10vw !important;
}
@media screen and (min-width: 768Px) {
html {
font-size: 37.5Px !important;
}
body {
max-width: 375Px;
max-height: 667Px;
margin: 0 auto !important;
}
}
</style>
<script lang="ts" src="./index.ts"></script>
\ No newline at end of file
app/web/page/activity/view/activity/index.ts
View file @ e7edd6c9
......@@ -11,6 +11,7 @@ export default class Activity extends Mixins(TransformStyleMixin) {
@Getter('pageData') pageData;
@State(state => state.activity.pageInfo.pageName) pageName;
@State(state => state.activity.gridLayout.rowHeight) rowHeight;
@Mutation('SET_PAGE_ELEMENTS') setPageElement;
@Provide('editor');
......@@ -36,6 +37,8 @@ export default class Activity extends Mixins(TransformStyleMixin) {
document.body.removeChild(hackIframe);
}, 300);
}
// 适配
this.modifyPoints();
}
}
......@@ -53,14 +56,19 @@ export default class Activity extends Mixins(TransformStyleMixin) {
fetchApi(options) {
const { store, route } = options;
const { pageId } = route.params;
// console.log('fetchApi', route);
return store.dispatch('getPageDate', { pageId });
}
createStyle({h}) {
return EASY_ENV_IS_NODE ? {
height: `${h * this.rowHeight}px`,
} : {};
modifyPoints() {
const elements = this.pageData?.elements?.map(v => {
const point = {
...v.point,
h: v.point.h * this.rowHeight * document.documentElement.clientWidth / 375,
w: document.documentElement.clientWidth
};
return { ...v, point };
});
this.setPageElement(elements);
}
modfiTabsStyle() {
......@@ -74,7 +82,7 @@ export default class Activity extends Mixins(TransformStyleMixin) {
gridItemEle.style.transform = 'none';
gridItemEle.style.top = `${transformY}px`;
// 处理backgroundColor
const backgroundColor = getStyle(tabsEle, 'backgroundColor');
const backgroundColor = getStyle(gridItemEle, 'backgroundColor');
const crTabs = tabsEle.childNodes[0];
crTabs.style.backgroundColor = backgroundColor;
const stickyEle = crTabs?.childNodes[0];
......
app/web/page/activity/view/activity/index.vue
View file @ e7edd6c9
......@@ -13,14 +13,14 @@
:vertical-compact="true"
:use-css-transforms="true"
>
<grid-item :style="createStyle(item.point)" v-for="(item, index) in pageData.elements"
<grid-item :style="transformStyle(item.commonStyle)" v-for="(item, index) in pageData.elements"
:x="item.point.x"
:y="item.point.y"
:w="item.point.w"
:h="item.point.h"
:i="item.point.i"
:key="item.point.i">
<component :style="transformStyle(item.commonStyle)" :data-index="index" :containerIndex="index" :childItem="item" :is="item.name" :key="item.id" v-bind="item.props"></component>
<component :data-index="index" :containerIndex="index" :childItem="item" :is="item.name" :key="item.id" v-bind="item.props"></component>
</grid-item>
</grid-layout>
<cr-back-top v-if="showBackTop && pageData.props.showBackTop" />
......@@ -28,22 +28,14 @@
</template>
<script lang="ts" src="./index.ts"></script>
<style lang="less" scoped>
html,
body,
#app {
height: 100%;
/deep/ .cr-popup {
.cr-notify {
font-size: 14px;
}
}
}
.activity {
width: 100%;
height: 100%;
min-height: 100%;
background-color: rgb(244, 244, 244);
box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);
overflow-x: hidden;
overflow-y: scroll;
/deep/ .vue-grid-layout {
min-height: 667px;
// transform: translateY(-10px);
......
app/web/page/mixins/transformStyle.mixin.ts
View file @ e7edd6c9
......@@ -5,7 +5,10 @@ import { transformStyle } from '@/service/utils.service';
export default class TransformStyleMixin extends Vue {
transformStyle(styleObj, element) {
// console.log('transformStyle', styleObj, element);
const style = {};
const style = {
backgroundRepeat: 'no-repeat',
backgroundSize: 'cover'
};
if (!styleObj) { return style; }
for (const key of Object.keys(styleObj)) {
if ( typeof styleObj[key] === 'number') {
......@@ -14,8 +17,7 @@ export default class TransformStyleMixin extends Vue {
style[key] = styleObj[key]?.includes('px') ? `${(+(styleObj[key].slice(0, -2)) / 37.5).toFixed(2)}rem` : styleObj[key];
}
if (key === 'backgroundImage' && style.backgroundImage) {
// style.backgroundImage = `url(${style.backgroundImage})`;
style.background = `url(${style.backgroundImage}) no-repeat 0 0 / cover`;
style.backgroundImage = `url(${style.backgroundImage})`;
}
}
return style;
......
app/web/page/store/modules/activity/index.ts
View file @ e7edd6c9
import api from '@/api/editor.api';
import { Module, GetterTree, ActionTree, MutationTree } from 'vuex';
import Vue from 'vue';
import { UPDATE_PAGE_INFO, SET_PAGE_INFO } from './type';
import { UPDATE_PAGE_INFO, SET_PAGE_INFO, SET_PAGE_DATA, SET_PAGE_ELEMENTS} from './type';
import RootState from '../../state';
import EditorState, { PageInfo, defaultState, Page, PageElement } from './state';
......@@ -37,7 +37,13 @@ export default class EditorModule implements Module<EditorState, RootState> {
} else {
page.splice(containerIndex, 1, data);
}
}
},
[SET_PAGE_DATA](state, data) {
state.pageInfo.page = data;
},
[SET_PAGE_ELEMENTS](state, data) {
if (data) { (state.pageInfo.page as Page).elements = data; }
},
};
constructor(initState: EditorState = JSON.parse(JSON.stringify(defaultState))) {
......
app/web/page/store/modules/activity/type.ts
View file @ e7edd6c9
......@@ -12,3 +12,4 @@ export const SET_PAGE_DATA = 'SET_PAGE_DATA';
export const UPDATE_COMMON_STYLE = 'UPDATE_COMMON_STYLE';
export const UPDATE_PAGE_STYLE = 'UPDATE_PAGE_STYLE';
export const UPDATE_PAGE_PROPS = 'UPDATE_PAGE_PROPS';
export const SET_PAGE_ELEMENTS = 'SET_PAGE_ELEMENTS';
\ No newline at end of file
app/web/view/layout.html
View file @ e7edd6c9
......@@ -5,15 +5,10 @@
<meta name="keywords">
<meta name="description">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,viewport-fit=cover">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="/public/asset/css/reset.css">
<link rel="stylesheet" type="text/css" href="https://activitystatic.lkbang.net/swiper/4.5.1/css/swiper.min.css">
<style>
html, body {
line-height: 1.15 !important;
}
</style>
</head>
<body>
<div id="app"><!--vue-ssr-outlet--></div>
......
config/config.default.ts
View file @ e7edd6c9
......@@ -27,7 +27,8 @@ export default (appInfo: EggAppConfig) => {
config.static = {
prefix: '/public/',
dir: path.join(appInfo.baseDir, 'public')
dir: path.join(appInfo.baseDir, 'public'),
gzip: true
};
config.keys = '123456';
......
package-lock.json
View file @ e7edd6c9
......@@ -1600,26 +1600,38 @@
}
},
"@qg/citrus-ui": {
"version": "0.0.29",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcitrus-ui/-/citrus-ui-0.0.29.tgz",
"integrity": "sha512-8Ca1e3/K+ts/kjG5+1EvNF3Cvkg/N6P1CtVTRN7SVRbM+5EYrIDaoC2qbt6K3ipSZ9EAb+t4qtKYdrT93NMASQ==",
"version": "0.0.34",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcitrus-ui/-/citrus-ui-0.0.34.tgz",
"integrity": "sha512-yj9jkif1cbWgs4fFZCUNrpqoRfQ2xiRQhW3C95MUKcVmOAxclTVYSalSuSjA9mCwubP3o6vTU6Y8av9X9mNSvg==",
"requires": {
"@better-scroll/core": "^2.1.1",
"@qg/cherry-ui": "^2.18.72",
"@qg/cherry-ui": "^2.20.3",
"@qg/js-bridge": "^1.1.9",
"axios": "^0.21.1",
"js-cookie": "^2.2.1",
"sa-sdk-javascript": "^1.16.1",
"swiper": "^4.5.1",
"vuex": "^3.6.0"
},
"dependencies": {
"@qg/cherry-ui": {
"version": "2.20.4",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcherry-ui/-/cherry-ui-2.20.4.tgz",
"integrity": "sha512-3xfenI5Umaae3R3r26J9c9TzayNrU+JJvBNBROKc2Lk+gEepFVbZCTD02JKhwsfOjDi/5KqkKX8vJrJWu4OHpw==",
"requires": {
"@popperjs/core": "^2.5.4",
"vue-lazyload": "^1.3.3",
"vue-video-player": "^5.0.2"
}
}
}
},
"@qg/js-bridge": {
"version": "1.1.10",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fjs-bridge/-/js-bridge-1.1.10.tgz",
"integrity": "sha512-g0Dd7pGuSvSLjsAoAZBnxmNsO6+pbh3pASC4F05CfN1qCJ13n1OpbOx2LPDRXuZkWAIe3ZaLwHOHiODEdv9exA==",
"version": "1.1.11",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fjs-bridge/-/js-bridge-1.1.11.tgz",
"integrity": "sha512-WVvkSUg2zcc2nblzYGxM/bVo+VDcANy/dw7vcbxLoW1Jega9Jm2d5FGSb7uS6m4746waghUUqcAWNJZ0Q5yeqA==",
"requires": {
"rollup": "^2.40.0"
"rollup": "^2.41.3"
}
},
"@types/accepts": {
......@@ -20364,9 +20376,9 @@
"integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
},
"rollup": {
"version": "2.41.2",
"resolved": "http://npmprivate.quantgroups.com/rollup/-/rollup-2.41.2.tgz",
"integrity": "sha512-6u8fJJXJx6fmvKrAC9DHYZgONvSkz8S9b/VFBjoQ6dkKdHyPpPbpqiNl2Bao9XBzDHpq672X6sGZ9G1ZBqAHMg==",
"version": "2.41.5",
"resolved": "http://npmprivate.quantgroups.com/rollup/-/rollup-2.41.5.tgz",
"integrity": "sha512-uG+WNNxhOYyeuO7oRt98GA2CNVRgQ67zca75UQVMPzMrLG9FUKzTCgvYVWhtB18TNbV7Uqxo97h+wErAnpFNJw==",
"requires": {
"fsevents": "~2.3.1"
}
......
webpack.config.js
View file @ e7edd6c9
......@@ -83,7 +83,7 @@ module.exports = {
{
default: false,
vue: {
name: 'chunk-vue', // 分离组件库
name: 'vue', // 分离组件库
priority: 23,
test: /[\\/]node_modules[\\/]vue[\\/]/,
enforce: true
......@@ -124,29 +124,19 @@ module.exports = {
enforce: true
},
cherryUI: {
name: 'chunk-cherry-uI', // 分离组件库
name: 'cherry-uI', // 分离组件库
priority: 18,
chunks: 'all',
test: /[\\/]node_modules[\\/]@qg[\\/]cherry-ui[\\/]/,
enforce: true
},
citrusUi: {
name: 'chunk-citrus-ui', // 分离组件库
name: 'citrus-ui', // 分离组件库
priority: 17,
chunks: 'all',
test: /[\\/]node_modules[\\/]@qg[\\/]citrus-ui[\\/]/,
enforce: true
},
common: {
name:'chunk-common',
minChunks: 3,
priority: 3,
reuseExistingChunk: true,
chunks (chunk) {
return ['login','editor','activity'].includes(chunk.name);
},
enforce: true
},
vendors:
{
name: 'common',
......
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