Skip to content

D
dataease
提交 d672f0ef authored 作者: fit2cloud-chenyw's avatar fit2cloud-chenyw
浏览文件
操作

style: 过滤组件样式

上级 a89a9a47
隐藏空白字符变更
内嵌 并排
正在显示 包含 113 行增加 和 71 行删除
frontend/src/components/dataease/DeOutWidget.vue
浏览文件 @ d672f0ef
......@@ -10,10 +10,18 @@
</div>
</div>
</div>
<div ref="deContentContainer" class="condition-content" :class="element.options.attrs.title ? '' : 'condition-content-default'">
<div
ref="deContentContainer"
class="condition-content"
:class="element.options.attrs.title ? '' : 'condition-content-default'"
>
<div class="condition-content-container">
<div class="first-element">
<div :class="element.component === 'de-select-grid' ? 'first-element-grid-contaner': ''" class="first-element-contaner">
<div
:class="element.component === 'de-select-grid' ? 'first-element-grid-contaner': ''"
class="first-element-contaner"
>
<component
:is="element.component"
v-if="element.type==='custom'"
......@@ -27,6 +35,7 @@
/>
</div>
</div>
</div>
</div>
</div>
......@@ -71,6 +80,7 @@ export default {
sizeInfo() {
let size
if (this.h > this.inputMaxSize) {
return size
} else if (this.h > this.inputLargeSize) {
size = 'medium'
} else if (this.h > this.inputSmallSize) {
......@@ -99,14 +109,12 @@ export default {
const titleWidth = this.$refs.deTitle.offsetWidth
const deContentContainer = this.$refs.deContentContainer
this.$nextTick(() => {
let min = 75
let min = this.element.style.fontSize * 2 + 50
if (this.element.component === 'de-number-range') {
min = 105
min = this.element.style.fontSize * 2 + 80
}
if (height < min) {
// console.log(titleWidth)
this.mainClass = 'condition-main-line'
/* deContentContainer && (deContentContainer.style.inset = '0 0 0 ' + (titleWidth + 15) + 'px') */
if (deContentContainer) {
deContentContainer.style.top = '0px'
......@@ -114,9 +122,8 @@ export default {
}
} else {
this.mainClass = ''
/* deContentContainer && (deContentContainer.style.inset = '33px 0px 0px') */
if (deContentContainer) {
deContentContainer.style.top = '33px'
deContentContainer.style.top = '2em'
deContentContainer.style.marginLeft = '0px'
}
}
......@@ -125,37 +132,38 @@ export default {
}
}
}
</script>
<style lang="scss" scoped>
.my-container {
position: absolute;
overflow: auto;
/* inset: 0px; */
top:0px;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
}
.ccondition-main {
position: absolute;
overflow: auto;
/* inset: 0px; */
top:0px;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
}
.condition-title {
/* inset: 0; */
top:0px;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
position: absolute;
height: 35px;
height: 2em;
cursor: -webkit-grab;
}
.first-title {
width: 100%;
overflow: hidden;
......@@ -166,12 +174,13 @@ export default {
}
.condition-title-absolute {
/* inset: 0px 0px; */
right: 0px;
bottom: 0px;
position: absolute;
top: 15px;
top: 0px;
left: 4px;
display: flex;
align-items: flex-end;
}
.span-container {
......@@ -182,14 +191,14 @@ export default {
.condition-content {
overflow: auto hidden;
/* inset: 33px 0px 0px; */
top: 33px;
top: 2em;
left: 0px;
right: 0px;
bottom: 0px;
position: absolute;
letter-spacing: 0px!important;
letter-spacing: 0px !important;
}
.condition-content-container {
position: relative;
display: table;
......@@ -197,6 +206,7 @@ export default {
height: 100%;
white-space: nowrap;
}
.first-element {
position: relative;
display: table-cell;
......@@ -205,25 +215,34 @@ export default {
padding: 0px;
height: 100%;
}
.first-element-contaner {
width: calc(100% - 10px);
background: initial;
position:absolute;
bottom: 5px;
margin: 0 4px;
div {
width: 100%;
}
width: calc(100% - 10px);
background: initial;
position: absolute;
bottom: 5px;
margin: 0 4px;
div {
width: 100%;
}
display: flex;
align-items: flex-end;
}
.first-element-grid-contaner {
background: #fff;
border: 1px solid #d7dae2;
top: 5px;
background: #fff;
border: 1px solid #d7dae2;
top: 5px;
}
.condition-main-line {
height: 40px !important;
height: 40px !important;
}
.condition-content-default {
inset: 0px 0px 0px !important;
inset: 0px 0px 0px !important;
}
</style>
frontend/src/components/widget/DeWidget/DeDate.vue
浏览文件 @ d672f0ef
......@@ -19,9 +19,13 @@
</template>
<script>
import { ApplicationContext } from '@/utils/ApplicationContext'
import { timeSection } from '@/utils'
import bus from "@/utils/bus";
import {
ApplicationContext
} from '@/utils/ApplicationContext'
import {
timeSection
} from '@/utils'
import bus from '@/utils/bus'
export default {
props: {
......@@ -92,7 +96,8 @@ export default {
}
},
created() {
if (this.element.serviceName === 'timeDateWidget' && this.element.options.attrs.default && this.element.options.attrs.default.isDynamic) {
if (this.element.serviceName === 'timeDateWidget' && this.element.options.attrs.default && this.element.options
.attrs.default.isDynamic) {
if (this.element.options.attrs.default) {
const widget = ApplicationContext.getService(this.element.serviceName)
this.values = widget.dynamicDateFormNow(this.element)
......@@ -172,15 +177,16 @@ export default {
fillValueDerfault() {
const defaultV = this.element.options.value === null ? '' : this.element.options.value.toString()
if (this.element.options.attrs.type === 'daterange') {
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') return []
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') { return [] }
return defaultV.split(',').map(item => parseFloat(item))
} else {
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') return null
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') { return null }
return parseFloat(defaultV.split(',')[0])
}
}
}
}
</script>
<style lang="scss" scoped>
......
frontend/src/components/widget/DeWidget/DeSelectGrid.vue
浏览文件 @ d672f0ef
......@@ -2,12 +2,19 @@
<div v-if="element.options!== null && element.options.attrs!==null && show" class="de-select-grid-class">
<div class="de-select-grid-search">
<el-input v-model="keyWord" :placeholder="$t('deinputsearch.placeholder')" :size="size" prefix-icon="el-icon-search" clearable />
<el-input
v-model="keyWord"
:placeholder="$t('deinputsearch.placeholder')"
:size="size"
prefix-icon="el-icon-search"
clearable
/>
</div>
<div class="list">
<div v-if="element.options.attrs.multiple" class="checkbox-group-container">
<el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAllChange">{{ $t('commons.all') }}</el-checkbox>
<el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAllChange">
{{ $t('commons.all') }}</el-checkbox>
<el-checkbox-group v-model="value" @change="handleCheckedChange">
<el-checkbox v-for="item in datas" :key="item.id" :label="item.id">{{ item.id }}</el-checkbox>
......@@ -27,7 +34,9 @@
</template>
<script>
import { multFieldValues } from '@/api/dataset/dataset'
import {
multFieldValues
} from '@/api/dataset/dataset'
export default {
props: {
......@@ -100,10 +109,10 @@ export default {
if (typeof value === 'undefined' || value === old) return
this.datas = []
this.element.options.attrs.fieldId &&
this.element.options.attrs.fieldId.length > 0 &&
multFieldValues(this.element.options.attrs.fieldId.split(',')).then(res => {
this.datas = this.optionDatas(res.data)
}) || (this.element.options.value = '')
this.element.options.attrs.fieldId.length > 0 &&
multFieldValues(this.element.options.attrs.fieldId.split(',')).then(res => {
this.datas = this.optionDatas(res.data)
}) || (this.element.options.value = '')
},
'element.options.attrs.multiple': function(value, old) {
if (typeof old === 'undefined' || value === old) return
......@@ -167,10 +176,10 @@ export default {
fillValueDerfault() {
const defaultV = this.element.options.value === null ? '' : this.element.options.value.toString()
if (this.element.options.attrs.multiple) {
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') return []
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') { return [] }
return defaultV.split(',')
} else {
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') return null
if (defaultV === null || typeof defaultV === 'undefined' || defaultV === '' || defaultV === '[object Object]') { return null }
return defaultV.split(',')[0]
}
},
......@@ -204,41 +213,49 @@ export default {
}
}
</script>
<style lang="scss" scoped>
.de-select-grid-search {
>>>input {
border-radius: 0px;
.de-select-grid-search {
>>>input {
border-radius: 0px;
}
}
.de-select-grid-class {
.list {
overflow-y: auto;
width: 100%;
position: absolute;
top: 30px;
bottom: 0;
}
.el-input {
display: block !important;
}
}
}
.radio-group-container > .el-radio-group > label {
display: block !important;
margin: 10px !important;
}
.de-select-grid-class {
height: 100%;
.checkbox-group-container{
label.el-checkbox {
display: block !important;
margin: 10px !important;
.list {
overflow-y: auto;
width: 100%;
position: relative;
bottom: 0;
height: calc(100% - 40px);
}
}
.el-checkbox-group > label {
.radio-group-container>.el-radio-group>label {
display: block !important;
margin: 10px !important;
}
}
.checkbox-group-container {
label.el-checkbox {
display: block !important;
margin: 10px !important;
}
.el-checkbox-group>label {
display: block !important;
margin: 10px !important;
}
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论