Skip to content

Commit

Permalink
修改相对定位元素bug
Browse files Browse the repository at this point in the history
  • Loading branch information
jy03078959 committed Dec 4, 2019
1 parent c4356bd commit 1084bb9
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 28 deletions.
18 changes: 11 additions & 7 deletions src/components/Selecter.vue
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@
border: 1px solid #59c7f9;
border-radius: 12px;
display: block;
opacity: 0.2;
opacity: 0.5;
&:hover {
opacity: 1;
Expand Down Expand Up @@ -573,12 +573,13 @@
}
// 记录位置的6个属性,有那些属性是设置过值的。
if (!isUnset(top)) style.top = top + 'px'
if (!isUnset(left)) style.left = left + 'px'
if (!isUnset(bottom)) style.bottom = bottom + 'px'
if (!isUnset(right)) style.right = right + 'px'
if (!isUnset(width)) style.width = width + 'px'
if (!isUnset(height)) style.height = height + 'px'
if (!isUnset(top)) this.$set(style, 'top', top + 'px')
if (!isUnset(left)) this.$set(style, 'left', left + 'px')
if (!isUnset(bottom)) this.$set(style, 'bottom', bottom + 'px')
if (!isUnset(right)) this.$set(style, 'right', right + 'px')
if (!isUnset(width)) this.$set(style, 'width', width + 'px')
if (!isUnset(height)) this.$set(style, 'height', height + 'px')
function ratioWH (w, h, r) {
Expand All @@ -589,6 +590,9 @@
},
setRectInfo (directions, isUnSetArray) {
var style = this.$parent.nodeInfo.style
if (style.position == 'relative') {
return
}
let selfRect = getNoRotateBoundingClientRect(window.$vue.$el)
let parentRect = null
if (style.position == 'fixed') {
Expand Down
16 changes: 8 additions & 8 deletions src/components/style/Base.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<el-form-item label="">
<num :styleAttr.sync="info.height"></num>
</el-form-item>
<editor-position v-show="!isRootNode" :info="info"></editor-position>
<editor-position v-if="isShowPosiition" :info="info"></editor-position>
<el-form-item label="透明度">
<div class="sliderWarp">
<el-slider class="slider" size="mini" :min="0" :max="1" v-model.number="info.opacity" :step="0.1"></el-slider>
Expand Down Expand Up @@ -85,7 +85,7 @@
<el-input class="input" type='number' :min="0" :max="25" :step='1' size="mini" v-model.number="style.padding" placeholder="0-25"></el-input>
</div>
</el-form-item>
<el-form-item label="外边距" v-if="hasShowMargin">
<el-form-item label="外边距" v-if="!fixedOrAbsolute">
<div class="sliderWarp">
<el-slider class="slider" size="mini" :min="0" :max="25" v-model.number="style.margin" :step="1"></el-slider>
<el-input class="input" type='number' :min="0" :max="25" :step='1' size="mini" v-model.number="style.margin" placeholder="0-25"></el-input>
Expand Down Expand Up @@ -143,7 +143,7 @@
},
data: function () {
return {
isRootNode: true,
isShowPosiition: false,
activeNames: ['size', 'border', 'align', 'background', 'border', 'boxShadow', 'margin', 'text'],
style: {
borderStyle: 'none',
Expand All @@ -161,11 +161,11 @@
}
},
computed: {
hasShowMargin () {
fixedOrAbsolute () {
if (this.info.position && (this.info.position == 'fixed' || this.info.position == 'absolute')) {
return false
} else {
return true
} else {
return false
}
}
},
Expand Down Expand Up @@ -229,14 +229,14 @@
deep: true,
handler: function (newVal, oldVal) {
if (newVal.opacity === '') newVal.opacity = 0
this.isRootNode = window.$vue && window.$vue.isRootNode
this.isShowPosiition = window.$vue && !window.$vue.isRootNode && this.fixedOrAbsolute
this.makeCssCode()
},
immediate: true
},
},
mounted: function () {
this.isRootNode = window.$vue && window.$vue.isRootNode
this.isShowPosiition = window.$vue && !window.$vue.isRootNode && this.fixedOrAbsolute
this.style = {
borderWidth: this.info['border-width'] ? parseFloat(this.info['border-width']) : 0,
borderRadius: this.info['border-radius'] ? parseFloat(this.info['border-radius']) : 0,
Expand Down
8 changes: 4 additions & 4 deletions src/components/style/Position.vue
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
class="input top-input small"
size="mini"
tabindex="-1"
:value="info.top"
v-model="info.top"
v-show="notEmpty(info.top)"
title="本节点顶边和父节点顶边的距离,可输入负值,默认单位为像素(px),也可以输入百分比,根据父节点 height 和百分比数值计算出距离"
></el-input>
Expand All @@ -31,7 +31,7 @@
>左</el-checkbox>
<el-input
v-show="notEmpty(info.left)"
:value="info.left"
v-model="info.left"
class="input bottom-input small"
tabindex="-1"
size="mini"
Expand Down Expand Up @@ -83,7 +83,7 @@
tabindex="-1"
size="mini"
v-show="notEmpty(info.right)"
:value="info.right"
v-model="info.right"
title="本节点右边和父节点右边的距离,可输入负值,默认单位为像素(px),也可以输入百分比,根据父节点 width 和百分比数值计算出距离"
style=""
></el-input>
Expand All @@ -103,7 +103,7 @@
size="mini"
tabindex="-1"
v-show="notEmpty(info.bottom)"
:value="info.bottom"
v-model="info.bottom"
title="本节点底边和父节点底边的距离,可输入负值,默认单位为像素(px),也可以输入百分比,根据父节点 height 和百分比数值计算出距离"
></el-input>
</div>
Expand Down
18 changes: 9 additions & 9 deletions src/config/local.js
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
/*
* 在本地开发调试时,三个web项目和一个node项目都是在独立运行的
* 因此需要配置每个服务的本地访问地址,以使能互相调用/请求
* admin、editor、view、api 四个服务的默认端口号分别为
* 8567、8565、8566、7051,因此默认配置如下
* 如果还希望像先前只启动本项目(demo 模式)进行体验,将 API_PATH
* 设置为 ‘https://godspen.ymm56.com/api/' 即可
*/
* 在本地开发调试时,三个web项目和一个node项目都是在独立运行的
* 因此需要配置每个服务的本地访问地址,以使能互相调用/请求
* admin、editor、view、api 四个服务的默认端口号分别为
* 8567、8565、8566、7051,因此默认配置如下
* 如果还希望像先前只启动本项目(demo 模式)进行体验,将 API_PATH
* 设置为 ‘https://godspen.ymm56.com/api/' 即可
*/

module.exports = {
EDITOR_PATH: 'http://127.0.0.1:8565/', // 编辑器访问地址
VIEW_PATH: 'http://127.0.0.1:8566/', // 页面客户端访问地址
ADMIN_PATH: 'http://127.0.0.1:8567/', // 管理后台访问地址
API_PATH: 'http://127.0.0.1:7051/api', // api 服务端访问地址
// API_PATH: 'https://godspen.ymm56.com/api/', // 启动demo模式,使用官方 api 服务
// API_PATH: 'http://127.0.0.1:7051/api', // api 服务端访问地址
API_PATH: 'https://godspen.ymm56.com/api/', // 启动demo模式,使用官方 api 服务
}

0 comments on commit 1084bb9

Please sign in to comment.