<template>
|
<uni-datetime-picker v-if="model" type="daterange" :value="toDate(model[data.fieldId])"
|
:placeholder="data.placeholder" :rangeSeparator="data.setting.separator" border :disabled="data.disabled"
|
@change="onChange" />
|
<uni-datetime-picker v-else type="daterange" :value="data.value" :placeholder="data.placeholder"
|
:rangeSeparator="data.setting.separator" border :disabled="data.disabled" @change="onChange" />
|
</template>
|
|
<script>
|
import dayjs from "dayjs";
|
export default {
|
name: 'OIFormDatePickerRange',
|
props: {
|
data: {
|
type: Object,
|
required: true,
|
},
|
model: Object,
|
},
|
data() {
|
return {}
|
},
|
computed: {},
|
methods: {
|
toDate(t) {
|
if (!t) return undefined;
|
else if (typeof t == "string") {
|
if (t.includes(",")) return this.toDate(t.split(","));
|
else return this.toDate([t, t]);
|
} else if (t instanceof Array) {
|
let dt = [];
|
let d0 = t[0];
|
let d1 = t[1];
|
if (!d0 && !d1) return undefined;
|
else if (!d0) return undefined;
|
else if (!d1) d1 = d0;
|
|
let dt0 = new Date(dayjs(d0).format("YYYY-MM-DD"));
|
let dt1 = new Date(dayjs(d1).format("YYYY-MM-DD"));
|
return [dt0, dt1];
|
}
|
},
|
onChange(val) {
|
if (val instanceof Array) {
|
let format = "YYYY-MM-DD";
|
if (this.data.setting.format)
|
format = this.data.setting.format
|
.replace(/y/g, "Y")
|
.replace(/m/g, "M")
|
.replace(/d/g, "D");
|
let dt = [];
|
let d0 = val[0];
|
let d1 = val[1];
|
if (!d0 && !d1) return undefined;
|
else if (!d0) return undefined;
|
else if (!d1) d1 = d0;
|
let dt0 = dayjs(d0).format(format);
|
let dt1 = dayjs(d1).format(format);
|
let date2 = [dt0, dt1]
|
if (!this.model) {
|
this.data.value = date2
|
} else {
|
this.model[this.data.fieldId] = date2
|
}
|
this.$emit("change", date2)
|
|
}
|
},
|
},
|
}
|
</script>
|
|
<style>
|
</style>
|
