Skip to content
This repository was archived by the owner on Mar 7, 2024. It is now read-only.

Commit 7209c6f

Browse files
marcuschristiansenmarcuschristiansen
committed
Send through the ResourceId from Listener Field
1 parent d58db8b commit 7209c6f

File tree

4 files changed

+28885
-129
lines changed

4 files changed

+28885
-129
lines changed

‎dist/js/field.js

Lines changed: 28744 additions & 1 deletion
Large diffs are not rendered by default.

‎resources/js/components/broadcaster-field/FormField.vue

Lines changed: 49 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,64 @@
11
<template>
2-
<default-field :field="field" :errors="errors">
3-
<template slot="field">
4-
<input
5-
:id="field.name"
6-
:type="this.field.type"
7-
class="w-full form-control form-input form-input-bordered"
8-
:class="errorClasses"
9-
:placeholder="field.name"
10-
:value="value"
11-
@input="setFieldAndMessage"
12-
/>
13-
</template>
14-
</default-field>
2+
<default-field :field="field" :errors="errors">
3+
<template slot="field">
4+
<input
5+
:id="field.name"
6+
:type="this.field.type"
7+
class="w-full form-control form-input form-input-bordered"
8+
:class="errorClasses"
9+
:placeholder="field.name"
10+
:value="value"
11+
@input="setFieldAndMessage"
12+
/>
13+
</template>
14+
</default-field>
1515
</template>
1616

1717
<script>
18-
import { FormField, HandlesValidationErrors } from 'laravel-nova'
18+
import { FormField, HandlesValidationErrors } from "laravel-nova";
1919
2020
export default {
21-
mixins: [FormField, HandlesValidationErrors],
21+
mixins: [FormField, HandlesValidationErrors],
2222
23-
props: ['resourceName', 'resourceId', 'field'],
23+
props: ["resourceName", "resourceId", "field"],
2424
25-
methods: {
26-
setFieldAndMessage(el) {
27-
const rawValue = el.target.value;
28-
let parsedValue = rawValue;
25+
methods: {
26+
setFieldAndMessage(el) {
27+
const rawValue = el.target.value;
28+
let parsedValue = rawValue;
2929
30-
if (this.field.type === 'number') {
31-
parsedValue = Number(rawValue)
32-
}
30+
if (this.field.type === "number") {
31+
parsedValue = Number(rawValue);
32+
}
3333
34-
Nova.$emit(this.field.broadcastTo, {
35-
'field_name': this.field.attribute,
36-
'value': parsedValue
37-
});
34+
Nova.$emit(this.field.broadcastTo, {
35+
field_name: this.field.attribute,
36+
value: parsedValue
37+
});
3838
39-
this.value = parsedValue;
40-
},
41-
42-
/*
43-
* Set the initial, internal value for the field.
44-
*/
45-
setInitialValue() {
46-
this.value = this.field.value || ''
47-
},
39+
this.value = parsedValue;
40+
},
4841
49-
/**
50-
* Fill the given FormData object with the field's internal value.
51-
*/
52-
fill(formData) {
53-
formData.append(this.field.attribute, this.value || '')
54-
},
42+
/*
43+
* Set the initial, internal value for the field.
44+
*/
45+
setInitialValue() {
46+
this.value = this.field.value || "";
47+
},
5548
56-
/**
57-
* Update the field's internal value.
58-
*/
59-
handleChange(value) {
60-
this.value = value
61-
},
49+
/**
50+
* Fill the given FormData object with the field's internal value.
51+
*/
52+
fill(formData) {
53+
formData.append(this.field.attribute, this.value || "");
6254
},
63-
}
55+
56+
/**
57+
* Update the field's internal value.
58+
*/
59+
handleChange(value) {
60+
this.value = value;
61+
}
62+
}
63+
};
6464
</script>

‎resources/js/components/listener-field/DetailField.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template>
2-
<panel-item :field="field" />
2+
<panel-item :field="field" />
33
</template>
44

55
<script>
66
export default {
7-
props: ['resource', 'resourceName', 'resourceId', 'field'],
8-
}
7+
props: ["resource", "resourceName", "resourceId", "field"]
8+
};
99
</script>

‎resources/js/components/listener-field/FormField.vue

Lines changed: 89 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -1,96 +1,109 @@
11
<template>
2-
<default-field :field="field" :errors="errors">
3-
<template slot="field">
4-
<div class="relative flex items-stretch">
5-
<input
6-
:id="field.name"
7-
type="text"
8-
class="w-full form-control form-input form-input-bordered"
9-
:class="errorClasses"
10-
:placeholder="field.name"
11-
v-model="value"
12-
/>
2+
<default-field :field="field" :errors="errors">
3+
<template slot="field">
4+
<div class="relative flex items-stretch">
5+
<input
6+
:id="field.name"
7+
type="text"
8+
class="w-full form-control form-input form-input-bordered"
9+
:class="errorClasses"
10+
:placeholder="field.name"
11+
v-model="value"
12+
/>
1313

14-
<div class="absolute rotating text-80 flex justify-center items-center pin-y pin-r mr-3" v-show="calculating">
15-
<svg class="w-4 h-4" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M457.373 9.387l-50.095 50.102C365.411 27.211 312.953 8 256 8 123.228 8 14.824 112.338 8.31 243.493 7.971 250.311 13.475 256 20.301 256h10.015c6.352 0 11.647-4.949 11.977-11.293C48.159 131.913 141.389 42 256 42c47.554 0 91.487 15.512 127.02 41.75l-53.615 53.622c-20.1 20.1-5.855 54.628 22.627 54.628H480c17.673 0 32-14.327 32-32V32.015c0-28.475-34.564-42.691-54.627-22.628zM480 160H352L480 32v128zm11.699 96h-10.014c-6.353 0-11.647 4.949-11.977 11.293C463.84 380.203 370.504 470 256 470c-47.525 0-91.468-15.509-127.016-41.757l53.612-53.616c20.099-20.1 5.855-54.627-22.627-54.627H32c-17.673 0-32 14.327-32 32v127.978c0 28.614 34.615 42.641 54.627 22.627l50.092-50.096C146.587 484.788 199.046 504 256 504c132.773 0 241.176-104.338 247.69-235.493.339-6.818-5.165-12.507-11.991-12.507zM32 480V352h128L32 480z" class=""></path></svg>
16-
</div>
17-
</div>
18-
</template>
19-
</default-field>
14+
<div
15+
class="absolute rotating text-80 flex justify-center items-center pin-y pin-r mr-3"
16+
v-show="calculating"
17+
>
18+
<svg class="w-4 h-4" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
19+
<path
20+
fill="currentColor"
21+
d="M457.373 9.387l-50.095 50.102C365.411 27.211 312.953 8 256 8 123.228 8 14.824 112.338 8.31 243.493 7.971 250.311 13.475 256 20.301 256h10.015c6.352 0 11.647-4.949 11.977-11.293C48.159 131.913 141.389 42 256 42c47.554 0 91.487 15.512 127.02 41.75l-53.615 53.622c-20.1 20.1-5.855 54.628 22.627 54.628H480c17.673 0 32-14.327 32-32V32.015c0-28.475-34.564-42.691-54.627-22.628zM480 160H352L480 32v128zm11.699 96h-10.014c-6.353 0-11.647 4.949-11.977 11.293C463.84 380.203 370.504 470 256 470c-47.525 0-91.468-15.509-127.016-41.757l53.612-53.616c20.099-20.1 5.855-54.627-22.627-54.627H32c-17.673 0-32 14.327-32 32v127.978c0 28.614 34.615 42.641 54.627 22.627l50.092-50.096C146.587 484.788 199.046 504 256 504c132.773 0 241.176-104.338 247.69-235.493.339-6.818-5.165-12.507-11.991-12.507zM32 480V352h128L32 480z"
22+
class
23+
/>
24+
</svg>
25+
</div>
26+
</div>
27+
</template>
28+
</default-field>
2029
</template>
2130

2231
<style lang="scss">
23-
@-webkit-keyframes rotating {
24-
from{
25-
transform: rotate(0deg);
26-
}
27-
to{
28-
transform: rotate(360deg);
29-
}
30-
}
31-
.rotating {
32-
animation: rotating 2s linear infinite;
33-
}
32+
@-webkit-keyframes rotating {
33+
from {
34+
transform: rotate(0deg);
35+
}
36+
to {
37+
transform: rotate(360deg);
38+
}
39+
}
40+
.rotating {
41+
animation: rotating 2s linear infinite;
42+
}
3443
</style>
3544

3645
<script>
37-
import { FormField, HandlesValidationErrors } from 'laravel-nova'
38-
import _ from 'lodash'
46+
import { FormField, HandlesValidationErrors } from "laravel-nova";
47+
import _ from "lodash";
3948
4049
export default {
41-
mixins: [FormField, HandlesValidationErrors],
42-
43-
props: ['resourceName', 'resourceId', 'field'],
50+
mixins: [FormField, HandlesValidationErrors],
4451
45-
created() {
46-
Nova.$on(this.field.listensTo, this.messageReceived)
47-
},
52+
props: ["resourceName", "resourceId", "field"],
4853
49-
data: () => ({
50-
calculating: false,
51-
field_values: {}
52-
}),
54+
created() {
55+
Nova.$on(this.field.listensTo, this.messageReceived);
56+
this.field_values["resourceId"] = parseInt(this.resourceId);
57+
},
5358
54-
methods: {
55-
messageReceived(message) {
56-
this.field_values[message.field_name] = message.value;
57-
this.calculateValue()
58-
},
59+
data: () => ({
60+
calculating: false,
61+
field_values: {}
62+
}),
5963
60-
calculateValue: _.debounce(function () {
61-
this.calculating = true;
64+
methods: {
65+
messageReceived(message) {
66+
this.field_values[message.field_name] = message.value;
67+
this.calculateValue();
68+
},
6269
63-
Nova.request().post(
64-
`/codebykyle/calculated-field/calculate/${this.resourceName}/${this.field.attribute}`,
65-
this.field_values
66-
).then((response) => {
67-
this.value = response.data.value;
68-
this.calculating = false;
69-
}).catch(() => {
70-
this.calculating = false;
71-
});
72-
}, 500),
70+
calculateValue: _.debounce(function() {
71+
this.calculating = true;
7372
74-
/*
75-
* Set the initial, internal value for the field.
76-
*/
77-
setInitialValue() {
78-
this.value = this.field.value || ''
79-
},
73+
Nova.request()
74+
.post(
75+
`/codebykyle/calculated-field/calculate/${this.resourceName}/${this.field.attribute}`,
76+
this.field_values
77+
)
78+
.then(response => {
79+
this.value = response.data.value;
80+
this.calculating = false;
81+
})
82+
.catch(() => {
83+
this.calculating = false;
84+
});
85+
}, 500),
8086
81-
/**
82-
* Fill the given FormData object with the field's internal value.
83-
*/
84-
fill(formData) {
85-
formData.append(this.field.attribute, this.value || '')
86-
},
87+
/*
88+
* Set the initial, internal value for the field.
89+
*/
90+
setInitialValue() {
91+
this.value = this.field.value || "";
92+
},
8793
88-
/**
89-
* Update the field's internal value.
90-
*/
91-
handleChange(value) {
92-
this.value = value
93-
},
94+
/**
95+
* Fill the given FormData object with the field's internal value.
96+
*/
97+
fill(formData) {
98+
formData.append(this.field.attribute, this.value || "");
9499
},
95-
}
100+
101+
/**
102+
* Update the field's internal value.
103+
*/
104+
handleChange(value) {
105+
this.value = value;
106+
}
107+
}
108+
};
96109
</script>

0 commit comments

Comments
 (0)