This commit is contained in:
@@ -14,9 +14,7 @@ TODO CLIENT STUFF
|
|||||||
|
|
||||||
TODO NEXT
|
TODO NEXT
|
||||||
|
|
||||||
DATETIME - Ok, fuck a combined date and time, no one else seems to support it but me so split it into separate components:
|
DATETIME
|
||||||
|
|
||||||
|
|
||||||
- DONE Wrap the date picker to work with our dates without losing time.
|
- DONE Wrap the date picker to work with our dates without losing time.
|
||||||
- Wrap a time picker to work with our dates without losing the date.
|
- Wrap a time picker to work with our dates without losing the date.
|
||||||
- Once this is done then combine them into a single component that:
|
- Once this is done then combine them into a single component that:
|
||||||
|
|||||||
@@ -181,8 +181,7 @@ export default {
|
|||||||
var errorMessage =
|
var errorMessage =
|
||||||
"API error: GET route =" + route + ", message =" + error.message;
|
"API error: GET route =" + route + ", message =" + error.message;
|
||||||
store.commit("logItem", errorMessage);
|
store.commit("logItem", errorMessage);
|
||||||
alert("Error: " + errorMessage);
|
|
||||||
reject(error);
|
|
||||||
if (error.message && error.message.includes("401")) {
|
if (error.message && error.message.includes("401")) {
|
||||||
store.commit(
|
store.commit(
|
||||||
"logItem",
|
"logItem",
|
||||||
@@ -190,6 +189,9 @@ export default {
|
|||||||
);
|
);
|
||||||
auth.logout();
|
auth.logout();
|
||||||
router.push("/login");
|
router.push("/login");
|
||||||
|
} else {
|
||||||
|
alert("Error: " + errorMessage);
|
||||||
|
reject(error);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
44
ayanova/src/components/gztimepicker.vue
Normal file
44
ayanova/src/components/gztimepicker.vue
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
<script>
|
||||||
|
//////////////////////////////////////////
|
||||||
|
// GZTimePicker
|
||||||
|
// This component was created to wrap the
|
||||||
|
// vuetify time picker to allow using string date
|
||||||
|
// and time in iso format and not lose the date
|
||||||
|
// portion when picking a new time
|
||||||
|
//2019-02-12T10:12:39.594206
|
||||||
|
/* eslint-disable */
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
value: {
|
||||||
|
type: String,
|
||||||
|
default: ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
render() {
|
||||||
|
var that = this;
|
||||||
|
return this.$createElement("v-time-picker", {
|
||||||
|
props: {
|
||||||
|
...this.$attrs,
|
||||||
|
value: this.value ? this.value.substr(11,8) : null
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
...this.$listeners,
|
||||||
|
input: function(time) {
|
||||||
|
// debugger;
|
||||||
|
//Put back the time portion from before
|
||||||
|
var combined = that.value.substr(0, 9) + time;
|
||||||
|
that.$emit("input", new Date(combined).toISOString());
|
||||||
|
|
||||||
|
},
|
||||||
|
"click:minute": function(time) {
|
||||||
|
// debugger;
|
||||||
|
//Put back the time portion from before
|
||||||
|
var combined = that.value.substr(0, 9) + time;
|
||||||
|
that.$emit("input", new Date(combined).toISOString());
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@@ -12,6 +12,7 @@ import NProgress from "nprogress";
|
|||||||
import "nprogress/nprogress.css";
|
import "nprogress/nprogress.css";
|
||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import gzdatepicker from "./components/gzdatepicker.vue";
|
import gzdatepicker from "./components/gzdatepicker.vue";
|
||||||
|
import gztimepicker from "./components/gztimepicker.vue";
|
||||||
|
|
||||||
/////////////////////////////////////////////////////////////////
|
/////////////////////////////////////////////////////////////////
|
||||||
// FORM VALIDATION
|
// FORM VALIDATION
|
||||||
@@ -102,51 +103,11 @@ Vue.filter("boolastext", function(value) {
|
|||||||
return value ? "Yes" : "Nope";
|
return value ? "Yes" : "Nope";
|
||||||
});
|
});
|
||||||
|
|
||||||
//COMPONENT DATE TEST
|
/////////////////////////////////////////////////////////////
|
||||||
|
//GZ COMPONENTS
|
||||||
//
|
//
|
||||||
|
|
||||||
Vue.component("gz-date-picker", gzdatepicker);
|
Vue.component("gz-date-picker", gzdatepicker);
|
||||||
|
Vue.component("gz-time-picker", gztimepicker);
|
||||||
// Vue.component("GzDatePicker", {
|
|
||||||
// props: {
|
|
||||||
// value: Date
|
|
||||||
// },
|
|
||||||
// render() {
|
|
||||||
// return this.$createElement("v-date-picker", {
|
|
||||||
// props: {
|
|
||||||
// ...this.$attrs,
|
|
||||||
// value: this.value ? this.value.toISOString().substr(0, 10) : null
|
|
||||||
// },
|
|
||||||
// on: {
|
|
||||||
// ...this.$listeners,
|
|
||||||
// input: date => this.$emit("input", new Date(date))
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// Vue.component("AltGzDatePicker", {
|
|
||||||
// props: {
|
|
||||||
// value: String
|
|
||||||
// },
|
|
||||||
// data: function() {
|
|
||||||
// return {
|
|
||||||
// ogdate: ""
|
|
||||||
// };
|
|
||||||
// },
|
|
||||||
// render() {
|
|
||||||
// return this.$createElement("v-date-picker", {
|
|
||||||
// props: {
|
|
||||||
// ...this.$attrs,
|
|
||||||
// value: this.value ? this.value.substr(0, 10) : null
|
|
||||||
// },
|
|
||||||
// on: {
|
|
||||||
// ...this.$listeners,
|
|
||||||
// input: date => this.$emit("input", new Date(date).toISOString())
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
/////////////////////////////////////////////////////////////////
|
/////////////////////////////////////////////////////////////////
|
||||||
// INSTANTIATE
|
// INSTANTIATE
|
||||||
|
|||||||
@@ -54,42 +54,11 @@
|
|||||||
<gz-date-picker label="TESTStartDate" v-model="obj.startDate"></gz-date-picker>
|
<gz-date-picker label="TESTStartDate" v-model="obj.startDate"></gz-date-picker>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
|
|
||||||
<!-- <v-flex xs12 sm6 lg4 xl3 px-2>
|
|
||||||
<v-menu
|
|
||||||
v-model="menu2"
|
|
||||||
:close-on-content-click="false"
|
|
||||||
:nudge-right="40"
|
|
||||||
lazy
|
|
||||||
transition="scale-transition"
|
|
||||||
offset-y
|
|
||||||
full-width
|
|
||||||
min-width="290px"
|
|
||||||
>
|
|
||||||
<v-text-field
|
|
||||||
slot="activator"
|
|
||||||
:value="dateFormatted"
|
|
||||||
:label="lc.get('WidgetStartDate')"
|
|
||||||
readonly
|
|
||||||
></v-text-field>
|
|
||||||
<v-date-picker v-model="pickStartDate" @input="menu2 = false"></v-date-picker>
|
|
||||||
</v-menu>
|
|
||||||
</v-flex>-->
|
|
||||||
<!--
|
|
||||||
<v-flex xs12 sm6 lg4 xl3 px-2>
|
<v-flex xs12 sm6 lg4 xl3 px-2>
|
||||||
<v-text-field slot="activator" v-model="obj.startDate" label="MyPicker" readonly></v-text-field>
|
<div>{{obj.startDate}}</div>
|
||||||
<v-date-picker v-model="obj.startDate" @input="menu2 = false"></v-date-picker>
|
<gz-time-picker label="TESTStartTime" v-model="obj.startDate"></gz-time-picker>
|
||||||
</v-flex>-->
|
</v-flex>
|
||||||
<!-- <v-flex xs12 sm6 lg4 xl3 px-2>
|
|
||||||
<v-date-picker
|
|
||||||
v-model="obj.startDate"
|
|
||||||
:label="lc.get('WidgetStartDate')"
|
|
||||||
v-validate="'required'"
|
|
||||||
:error-messages="errors.collect('startDate')"
|
|
||||||
data-vv-name="startDate"
|
|
||||||
landscape="true"
|
|
||||||
reactive="true"
|
|
||||||
></v-date-picker>
|
|
||||||
</v-flex>-->
|
|
||||||
<v-flex xs12 sm6 lg4 xl3 px-2>
|
<v-flex xs12 sm6 lg4 xl3 px-2>
|
||||||
<v-checkbox
|
<v-checkbox
|
||||||
v-model="obj.active"
|
v-model="obj.active"
|
||||||
@@ -113,9 +82,8 @@
|
|||||||
<v-btn @click="submit">submit</v-btn>
|
<v-btn @click="submit">submit</v-btn>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
</v-layout>
|
</v-layout>
|
||||||
</form>
|
</form>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
|
|
||||||
</v-layout>
|
</v-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -172,10 +140,8 @@ export default {
|
|||||||
//return this.obj.startDate ? moment(this.date).format("dddd, MMMM Do YYYY") : "";
|
//return this.obj.startDate ? moment(this.date).format("dddd, MMMM Do YYYY") : "";
|
||||||
},
|
},
|
||||||
pickStartDate() {
|
pickStartDate() {
|
||||||
return this.obj.startDate
|
return this.obj.startDate ? dayjs(this.obj.startDate).toDate() : null;
|
||||||
? dayjs(this.obj.startDate).toDate()
|
// var copiedDate = new Date(date.getTime());
|
||||||
: null;
|
|
||||||
// var copiedDate = new Date(date.getTime());
|
|
||||||
//obj.startDate.toISOString().substr(0, 10);
|
//obj.startDate.toISOString().substr(0, 10);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user