Files
foton-laws-system-front/src/components/CustomFormComponents/DatePicker.vue
T

79 lines
1.5 KiB
Vue

<template>
<!-- <div>-->
<!-- </div>-->
<el-col :span="span">
<el-form-item
:label="config.attrName"
:title="config.attrName"
:prop="config.attrField"
label-width="150px"
class="add-form-item"
:class="{'form-item-disabled': disabled}"
>
<el-date-picker
:value-format="valueFormat"
format="yyyy-MM-dd"
:value="value"
type="date"
:editable="true"
:disabled="disabled"
:placeholder="placeholder"
@input="handleChange"
>
</el-date-picker>
</el-form-item>
</el-col>
</template>
<script>
export default {
name: 'CusTomDataPicker',
props: {
config: {
type: Object,
required: true
},
value: {
required: true
},
disabled: {
type: Boolean,
default: false
},
valueFormat: {
type: String,
default: 'yyyy-MM-dd'
},
// 栅格比例
span: {
type: Number,
default: 24
}
},
computed: {
placeholder () {
return `请选择${this.config.attrName}`
},
showMessage () {
return `${this.config.attrName}不能为空`
},
isRequired () {
return !!this.config.isMust
},
isString (str) {
return (typeof str === 'string') && str.constructor === String
}
},
methods: {
handleChange (value) {
// const value = event.target.value
this.$emit('input', value)
}
}
}
</script>
<style scoped>
</style>