Commit c4788b63 authored by 何虹's avatar 何虹 💬

表格中数字输入框点击时,复制全部;2.下拉框,日期框弹出后,点击页面其他地方要隐藏收起。

parent 063cad3f
......@@ -6,6 +6,8 @@
>{{configData.title}}</div>
<div class="containerSelf">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
@change='changed'
size='mini'
v-model="valueInner"
......@@ -57,6 +59,9 @@ export default {
}
},
methods: {
hidePicker() {
this.$refs.currentDom.hidePicker()
},
execAction(actionName, value) {
const type = typeof actionName
if (type === 'function') {
......
......@@ -6,6 +6,9 @@
>{{configData.title}}</div>
<div class="containerSelf">
<el-time-picker
size='mini'
ref='currentDom'
v-clickoutside="hidePicker"
:is-range='configData.isRange'
v-model="valueInner"
range-separator="至"
......@@ -45,11 +48,11 @@ export default {
},
set: function(value) {
const isRange = this.configData.isRange
if(!value){//点击清除时
this.$emit('input', '')
if (!value) { // 点击清除时
this.$emit('input', '')
return
}
if (!isRange) {//单个时间
if (!isRange) { // 单个时间
this.$emit('input', value)
return
}
......@@ -65,6 +68,9 @@ export default {
}
},
methods: {
hidePicker() {
this.$refs.currentDom.hidePicker()
},
getDefaultTime() {
const t1 = moment().format('HH:mm:ss')
return [t1, '23:59:59']
......
......@@ -24,6 +24,8 @@
</template>
<template v-else-if="item.type==='elDatePicker'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
style="width:100%"
size='mini'
......@@ -39,6 +41,8 @@
</template>
<template v-else-if="item.type==='elDatePickerDatetime'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
style="width:100%"
size='mini'
......@@ -51,6 +55,8 @@
</template>
<template v-else-if="item.type==='elDatePickerDate'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
style="width:100%"
size='mini'
......@@ -63,6 +69,8 @@
</template>
<template v-else-if="item.type==='elDatePickerMonth'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
style="width:100%"
size='mini'
......@@ -75,6 +83,8 @@
</template>
<template v-else-if="item.type==='elDatePickerMonthRange'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
style="width:100%"
size='mini'
......@@ -383,16 +393,23 @@
</template>
<script>
import elementUiMinins from '../../ucClass/elementUiMinins'
// import elementUiMinins from '../../ucClass/elementUiMinins'
import clickOutSide from '../../ucClass/click-out-side'
export default {
mixins: [elementUiMinins],
// mixins: [elementUiMinins],
name: 'dyncFormItemComponentChild',
directives: {
clickoutside: clickOutSide
},
props: {
type: {},
item: {},
formParms: {}
},
methods: {
hidePicker() {
this.$refs.currentDom.hidePicker()
},
itemClick() {
if (this.$listeners.searchSubmit) {
this.$listeners.searchSubmit()
......
......@@ -6,7 +6,9 @@
<child
v-bind="$attrs"
v-on="$listeners"
></child>
>
</child>
</hs-component-shell>
</template>
<script>
......
......@@ -6,6 +6,7 @@
>{{configData.title}}</div>
<div class="inputCurr">
<el-input-number
@focus="selectContent($event)"
:size='configData.size'
@keyup.enter.native="submitInput"
v-model="innerValue"
......@@ -76,6 +77,9 @@ export default {
}
},
methods: {
selectContent(e) {
e.currentTarget.select()
},
execAction(actionName, value) {
const type = typeof actionName
if (type === 'function') {
......
......@@ -11,7 +11,7 @@
>
<el-select
:class="{'noneStyle':isReadOnly1,'noneStyle2':isReadOnly1}"
v-click-outside='handleClickOutside'
v-clickoutside='handleClickOutside'
ref='elSelect'
:allow-create='configData.allowCreate'
:default-first-option='configData.defaultFirstOption'
......@@ -31,8 +31,8 @@
placeholder=""
>
<el-option
v-for="item in options_"
:key="item.value"
v-for="(item,index) in options_"
:key="index"
:label="item.label"
:value="item.value"
:disabled='item.label===" "'
......@@ -65,24 +65,6 @@ import _ from 'lodash'
export default {
mixins: [commonMixins],
name: 'select-plus-component',
directives: {
'click-outside': {
bind: (el, binding, vnode) => {
el.clickOutsideEvent = event => {
// here I check that click was outside the el and his childrens
if (!(el === event.target || el.contains(event.target))) {
if (vnode.context && vnode.context.clickOutSide) {
vnode.context.clickOutSide()
}
}
}
document.body.addEventListener('click', el.clickOutsideEvent)
},
unbind: function(el) {
document.body.removeEventListener('click', el.clickOutsideEvent)
}
}
},
props: {
parentType: {}
},
......@@ -508,15 +490,6 @@ export default {
}
},
handleClickOutside() {
this.clickOutSide()
},
myFunc(event) {
const e = event || window.event
if (this.$refs.elSelect && !this.$refs.elSelect.$el.contains(e.target)) {
this.clickOutSide()
}
},
clickOutSide() {
this.$refs.elSelect.blur()
},
mergeCinfig(config1, config2) {
......
......@@ -40,6 +40,8 @@
<template v-else-if="item.showType==='elDatePicker'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
:disabled='getDisabled||isEditable'
style="width:100%"
......@@ -55,6 +57,8 @@
</template>
<template v-else-if="item.showType==='elDatePickerDatetime'">
<el-date-picker
ref='currentDom'
v-clickoutside="hidePicker"
clearable
:disabled='getDisabled||isEditable'
style="width:100%"
......@@ -231,7 +235,11 @@
</template>
<script>
import clickOutSide from '../../ucClass/click-out-side'
export default {
directives: {
clickoutside: clickOutSide
},
name: 'dyncFormItemComponentChild_',
props: {
item: {},
......@@ -283,6 +291,9 @@ export default {
}
},
methods: {
hidePicker() {
this.$refs.currentDom.hidePicker()
},
enterInput(val) {
this.$emit('enterInput', val)
}
......
......@@ -94,7 +94,7 @@
v-else
:key="index"
:resizable="columnItem.resizable"
:show-overflow-tooltip="columnItem.showOverflow"
:show-overflow-tooltip="true"
:prop="columnItem.prop"
:label="columnItem.label"
:fixed="columnItem.fixed"
......@@ -234,7 +234,7 @@
v-else
:key="index"
:resizable="column.resizable"
:show-overflow-tooltip="column.showOverflow"
:show-overflow="true"
:field="column.prop"
:title="column.label"
:fixed="column.fixed"
......
export default {
bind(el, binding, vnode) {
el.handler = function(e) {
if (el.contains(e.target)) {
return false
}
// vnode.context[binding.expression] = false
binding.value()
}
el.stopProp = function(event) {
event.stopPropagation()
}
el.addEventListener('click', el.stopProp)
document.body.addEventListener('click', el.handler)
},
unbind(el, binding) {
el.removeEventListener('click', el.stopProp)
document.body.removeEventListener('click', el.handler)
},
install(Vue) {
Vue.directive('clickoutside', {
bind: this.bind,
unbind: this.unbind
})
}
}
//import elementUiMinins from './elementUiMinins'
// import elementUiMinins from './elementUiMinins'
import clickOutSide from './click-out-side'
export default {
// mixins:[elementUiMinins],
directives: {
clickoutside: clickOutSide
},
props: {
prop: {
type: String
},
formData: {
type: Object,
default () {
default() {
return {}
}
},
config: {// 配置项目
type: Object,
default () {
default() {
return {}
}
},
......@@ -22,7 +26,7 @@ export default {
},
elInfo: {
type: Object,
default () {
default() {
return {}
}
},
......
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