Browse Source

优化

master
陈裕财 3 years ago
parent
commit
5a709b29e5
  1. 37
      src/components/DateField/index.vue
  2. 10
      src/components/DateRangeField/index.vue

37
src/components/DateField/index.vue

@ -1,11 +1,12 @@
<template>
<div class="field-box">
<el-avatar class="avater" :icon="getMyIcon(myVal)" :style="{backgroundColor:getMyColor(myVal)}">{{getMyAvaterInfo(myVal)}}</el-avatar>
<el-avatar class="avater" :icon="avaterCpd.icon" :style="{backgroundColor:avaterCpd.color}">{{avaterCpd.innerText}}</el-avatar>
<div class="field-info">
<slot name="field-info" :value="myVal">
<span class="field-value">{{myVal?formatDate( new Date(myVal),format):'' }} </span>
<slot name="field-info" :value="dateRange">
<span class="field-value" v-if="!avaterCpd.isNull">{{avaterCpd.innerText}} </span>
<span class="field-value" v-else><span class="label-font-color"></span></span>
<slot name="label">
<span class="field-label">{{label}}</span>
<div v-if="disabled!==true" class="my-select" name="select" :value="myVal">
@ -26,6 +27,36 @@
name: 'date-field',
components: { },
computed: {
avaterCpd(){
var isEmpty=!this.myVal
var date=isEmpty?"":this.formatDate(new Date(this.myVal),this.format)
var obj={isNull:isEmpty,icon:'el-icon-date',color:'#E4E7ED',innerText:date}
if(this.getColor||this.color){
if(this.getColor){
obj.color= this.getColor(this.myVal)
}else{
obj.color=this.color
}
}else{
if(!isEmpty){
obj.color= util.getColor(this.myVal)
}
}
if(this.getIcon||this.icon){
if(this.getIcon){
obj.icon= this.getIcon(this.myVal )
}else if(this.icon){
obj.icon=this.icon
}
}
if(isEmpty){
obj.innerText=''
}
return obj;
}
},
data(){
return {

10
src/components/DateRangeField/index.vue

@ -34,9 +34,9 @@ export default {
components: { },
computed: {
avaterCpd(){
var isEmpty=this.isEmpty(this.dateRange)
var formatDate=this.formatDateRange(this.dateRange);
var obj={isNull:isEmpty,icon:'el-icon-full-screen',color:'#E4E7ED',innerText:formatDate}
var isEmpty=this.dateRange==null ||this.dateRange.length==0
var formatDate=isEmpty?"":this.formatDateRange(this.dateRange);
var obj={isNull:isEmpty,icon:'el-icon-date',color:'#E4E7ED',innerText:formatDate}
if(this.getColor||this.color){
if(this.getColor){
obj.color= this.getColor(this.dateRange)
@ -55,10 +55,6 @@ export default {
}else if(this.icon){
obj.icon=this.icon
}
}else {
if(!isEmpty){
obj.icon=''
}
}
return obj;

Loading…
Cancel
Save