Commit 3627f1e3 authored by 郝聪敏's avatar 郝聪敏

feature: 修改bug

parent 1000f997
......@@ -4,6 +4,7 @@ export const businessComponents = require('@qg/citrus-ui/md/index.json');
export const basicComponents = [
{
eleName: 'freedom-container',
coverImage: 'https://img.lkbang.net/citrus-ui/cherry-component-cover-free-container.png',
title: '自由容器',
config: [
// {
......
<template>
<Modal v-model="showPopup" width="380" @on-visible-change="change" class-name='basic-form'>
<Form ref="formCustom" :model="formCustom" :rules="ruleCustom" :label-width="80" label-position="left">
<Form @submit.native.prevent ref="formCustom" :model="formCustom" :rules="ruleCustom" :label-width="80" label-position="left">
<FormItem label="页面名称" prop="pageName">
<Input v-model="formCustom.pageName" placeholder="请输入页面名称"></Input>
</FormItem>
......
......@@ -6,7 +6,7 @@
<p slot="title">{{ config.title }}</p>
<div class="dynamic-row-card">
<img
src="https://activitystatic.q-gp.com/%E5%95%86%E5%93%81%402x.png"
:src="config.coverImage || 'http://activitystatic.q-gp.com/low_code.jpg'"
/>
</div>
</Card>
......
......@@ -5,7 +5,7 @@
<h4>项目{{index + 1}}</h4>
<a @click="del(index)">删除</a>
</div>
<Form :model="item" :label-width="80">
<Form @submit.native.prevent :model="item" :label-width="80">
<FormItem :prop="`${keywords.key}`" :label="keywords.name" :key="idx" v-for="(keywords, idx) in formControl">
<component :is="getComponent(keywords.type)" :options="item.options" v-model="item[keywords.key]" />
</FormItem>
......
......@@ -5,7 +5,7 @@
<div slot='title' class="Fl-card-title">
<a slot='title' @click="add()">{{editText('edit')}}</a>
</div>
<Form :model="form" :label-width="80">
<Form @submit.native.prevent :model="form" :label-width="80">
<FormItem :prop="`${keywords.key}`" :label="keywords.name" :key="idx" v-for="(keywords, idx) in formControl">
<component :is="getComponent(keywords.type)" :options="keywords.options" v-model="form[keywords.key]" />
</FormItem>
......
<template>
<div class="dynamic-form" v-if="isSelected">
<h2>{{curElement.title}}</h2>
<Form class="dynamic-form-component" :label-width="80" :model="form" v-if="curElement.schame && curElement.schame.length">
<Form class="dynamic-form-component" @submit.native.prevent :label-width="80" :model="form" v-if="curElement.schame && curElement.schame.length">
<h3 v-if="!hasGroup">组件属性</h3>
<template v-for="(item, index) in curElement.schame">
<div v-if="item.title">
......@@ -15,7 +15,7 @@
</FormItem>
</template>
</Form>
<Form class="dynamic-form-basic" :label-width="80">
<Form class="dynamic-form-basic" @submit.native.prevent :label-width="80">
<h3>基础样式</h3>
<template v-if="childSelected">
<template v-for="item in styleSchame.curEle">
......
<template>
<div class="dynamic-form">
<h2>{{title}}</h2>
<Form class="dynamic-form-component" :label-width="80" :model="propsForm">
<Form class="dynamic-form-component" :label-width="80" :model="propsForm" @submit.native.prevent>
<h3>基础属性</h3>
<template v-for="(item, index) in propsSchame">
<FormItem class="Df-component-formitem" :label="item.name" >
......@@ -9,7 +9,7 @@
</FormItem>
</template>
</Form>
<Form class="dynamic-form-component" :label-width="80" :model="commonStyleForm">
<Form class="dynamic-form-component" :label-width="80" :model="commonStyleForm" @submit.native.prevent>
<h3>基础样式</h3>
<template v-for="(item, index) in commonStyleSchame">
<FormItem class="Df-component-formitem" :label="item.name" >
......
......@@ -15,6 +15,17 @@
</template>
<script lang="ts" src="./index.ts"></script>
<style lang="less" scoped>
.border() {
&:before {
position: absolute;
content: '';
border: 1px dashed #0c0c0c !important;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
}
.freedom {
height: 100%;
width: 100%;
......@@ -31,9 +42,21 @@
height: 100%;
overflow: hidden;
&-item {
position: absolute;
z-index: 2;
font-size: 0;
&:after {
position: absolute;
top: 0;
left: 0;
content: '';
width: 100%;
height: 100%;
z-index: 3;
}
&:hover {
border: 1px dashed #0c0c0c !important;
.border();
}
}
&-dot {
......@@ -46,7 +69,7 @@
z-index: 1001;
}
.Fb-item_selected {
border: 1px dashed #0c0c0c !important;
.border();
}
}
.activity {
......
<template>
<div class="tableComStyle">
<div class="searchFormStyle qg-table">
<Form inline ref="searchForm" :rules="searchCondition.rules || {}" :model="searchForm" class="inline">
<Form @submit.native.prevent inline ref="searchForm" :rules="searchCondition.rules || {}" :model="searchForm" class="inline">
<FormItem :key="getKey(item.key)" :prop="getKey(item.key)" :rules="item.rules" :label="item.label" v-for="item in searchCondition">
<Input v-model="searchForm[item.key]" placeholder="" class="comWidth" v-if="item.type === 'input'" clearable />
<Select v-model="searchForm[item.key]" class="comWidth" filterable v-else-if="item.type === 'select'" clearable>
......
......@@ -136,7 +136,7 @@ export default class DashBoard extends Mixins(ContextMenuMixin, GoodsTabsMixin,
}
dragover(event) {
if (event.target.classList.contains('freedom')) {
if (event?.target?.children?.[0]?.classList.contains('freedom')) {
event.dataTransfer.dropEffect = 'move';
} else {
event.dataTransfer.dropEffect = 'copy';
......@@ -169,22 +169,23 @@ export default class DashBoard extends Mixins(ContextMenuMixin, GoodsTabsMixin,
this.isCollapsed = false;
const data = JSON.parse(event.dataTransfer.getData('text'));
const { layerX: left, layerY: top } = event;
const target = event?.target?.children?.[0]?.children?.[0] || {};
event.dataTransfer.clearData();
// template
if (data.template) {
this.setPageData(JSON.parse(data.template));
this.handleElementClick(null, null);
// freedom
} else if (event.target.classList.contains('freedom-body')) {
const { y: curY } = this.pageData.elements[event.target.dataset.index].point;
} else if (target?.classList?.contains('freedom-body')) {
const { y: curY } = this.pageData.elements[target?.dataset?.index].point;
const scrollTop = this.layout.reduce((pre, cur) => {
if (cur.y < curY) {
return pre + cur.h * this.rowHeight;
}
return pre;
}, 0);
this.addElements({ containerIndex: event.target.dataset.index, data: { ...data, commonStyle: { position: 'absolute', left, top: top - scrollTop } } });
this.handleElementClick(+event.target.dataset.index, this.pageData.elements[event.target.dataset.index].child.length - 1);
this.addElements({ containerIndex: target?.dataset?.index, data: { ...data, commonStyle: { position: 'absolute', left, top: top - scrollTop } } });
this.handleElementClick(+target?.dataset?.index, this.pageData.elements[target?.dataset?.index].child.length - 1);
// component
} else {
const y = Math.floor(top / this.rowHeight);
......
......@@ -66,16 +66,16 @@
@click.native.stop="toggle(false)"
>
<grid-item @click.native.stop="handleElementClick(index, null)" 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"
@contextmenu.native.prevent="show($event, index)"
@resized="resizedEvent"
@moved="movedEvent"
:class="{'Dcmcp-item_selected': curEleIndex === index && curChildIndex === null}">
:x="item.point.x"
:y="item.point.y"
:w="item.point.w"
:h="item.point.h"
:i="item.point.i"
:key="item.point.i"
@contextmenu.native.prevent="show($event, index)"
@resized="resizedEvent"
@moved="movedEvent"
:class="{'Dcmcp-item_selected': curEleIndex === index && curChildIndex === null}">
<component ref="container" :style="transformStyle(item.commonStyle)" :id="item.id" class="Dcmcp-item-com" @handleElementClick="handleElementClick" :containerIndex="index" :childItem="item" :is="item.name" :key="index" v-bind="item.props"></component>
</grid-item>
</grid-layout>
......@@ -105,6 +105,19 @@
justify-content: center;
}
}
.border() {
&:before {
position: absolute;
content: '';
border: 1px dashed #0c0c0c !important;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
}
.dashboard {
min-width: 1280px;
height: 100% !important;
......@@ -185,20 +198,29 @@
/deep/ .vue-grid-layout {
min-height: 667px;
.vue-grid-item {
position: relative;
text-align: center;
overflow: hidden;
&:after {
position: absolute;
top: 0;
left: 0;
content: '';
width: 100%;
height: 100%;
z-index: 1;
}
&:hover {
border: 1px dashed #0c0c0c !important;
.border();
}
// &>*:first-child {
// height: 100%;
// }
.vue-resizable-handle {
z-index: 10000;
}
}
.Dcmcp-item_selected {
border: 1px dashed #0c0c0c !important;
.border();
}
}
&_draging {
......
......@@ -1464,14 +1464,14 @@
"integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw=="
},
"@popperjs/core": {
"version": "2.9.0",
"resolved": "http://npmprivate.quantgroups.com/@popperjs%2fcore/-/core-2.9.0.tgz",
"integrity": "sha512-wjtKehFAIARq2OxK8j3JrggNlEslJfNuSm2ArteIbKyRMts2g0a7KzTxfRVNUM+O0gnBJ2hNV8nWPOYBgI1sew=="
"version": "2.9.1",
"resolved": "http://npmprivate.quantgroups.com/@popperjs%2fcore/-/core-2.9.1.tgz",
"integrity": "sha512-DvJbbn3dUgMxDnJLH+RZQPnXak1h4ZVYQ7CWiFWjQwBFkVajT4rfw2PdpHLTSTwxrYfnoEXkuBiwkDm6tPMQeA=="
},
"@qg/cherry-ui": {
"version": "2.18.75",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcherry-ui/-/cherry-ui-2.18.75.tgz",
"integrity": "sha512-F5a1iySaJ70IZ9/kdY7DoijR+Wa5nzJjhaGtv4n9wrujxwrIPJPJ7k+sgAmujJXWgzGoSVYqPT6AFhg4JJ1GCQ==",
"version": "2.19.2",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcherry-ui/-/cherry-ui-2.19.2.tgz",
"integrity": "sha512-II08ZVAofNCPL3FM5os5P2TlmgsiNKLxO0f+dLFUb8YpbFmrj/fIKh4z7NO4MFQ+pK5TzwXi4M+ptS3onjOrIg==",
"requires": {
"@popperjs/core": "^2.5.4",
"vue-lazyload": "^1.3.3",
......@@ -1479,9 +1479,9 @@
}
},
"@qg/citrus-ui": {
"version": "0.0.21",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcitrus-ui/-/citrus-ui-0.0.21.tgz",
"integrity": "sha512-um+tQJJ+3R4qZ3IjZ8bNtnkaNqtnHypihbagNNKKkm3iS9XuL77MFzjX+SrXMCJlU1i3/aXBdLOokeKZc9FOoQ==",
"version": "0.0.23",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fcitrus-ui/-/citrus-ui-0.0.23.tgz",
"integrity": "sha512-Hmgm7KGFyqEoZzRE0r0ybMULQSA+fJ2V2T0po9xKv+eNehIuyTJ903UganwmaYz7sK21BuQg+hrMi2OznFWO/Q==",
"requires": {
"@better-scroll/core": "^2.1.1",
"@qg/cherry-ui": "^2.18.72",
......@@ -1494,9 +1494,12 @@
}
},
"@qg/js-bridge": {
"version": "1.1.9",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fjs-bridge/-/js-bridge-1.1.9.tgz",
"integrity": "sha512-ZIBzdYBae+5QLdCH8/8qjixvIrQNoVvxMYEKJv6wpFF9J/xEV2e3f+3KkPAlAjjyKSjSYarmYwZGgIGov53psg=="
"version": "1.1.10",
"resolved": "http://npmprivate.quantgroups.com/@qg%2fjs-bridge/-/js-bridge-1.1.10.tgz",
"integrity": "sha512-g0Dd7pGuSvSLjsAoAZBnxmNsO6+pbh3pASC4F05CfN1qCJ13n1OpbOx2LPDRXuZkWAIe3ZaLwHOHiODEdv9exA==",
"requires": {
"rollup": "^2.40.0"
}
},
"@riophae/vue-treeselect": {
"version": "0.4.0",
......@@ -19822,6 +19825,14 @@
"resolved": "http://npmprivate.quantgroups.com/rndm/-/rndm-1.2.0.tgz",
"integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
},
"rollup": {
"version": "2.41.0",
"resolved": "http://npmprivate.quantgroups.com/rollup/-/rollup-2.41.0.tgz",
"integrity": "sha512-Gk76XHTggulWPH95q8V62bw6uqDH6UGvbD6LOa3QUyhuMF3eOuaeDHR7SLm1T9faitkpNrqzUAVYx47klcMnlA==",
"requires": {
"fsevents": "~2.3.1"
}
},
"run-async": {
"version": "2.4.1",
"resolved": "http://npmprivate.quantgroups.com/run-async/-/run-async-2.4.1.tgz",
......
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