fix: separate fetch from field code from text control
This commit is contained in:
Shariq Ansari
parent
9608c32db7
commit
c58f4e152c
4 changed files with 96 additions and 85 deletions
|
|
@ -18,6 +18,10 @@ let docfield_df = computed(() => {
|
|||
return false;
|
||||
}
|
||||
|
||||
if (df.fieldname === "fetch_from") {
|
||||
df.fieldtype = "Fetch From";
|
||||
}
|
||||
|
||||
if (
|
||||
in_list(["fetch_from", "fetch_if_empty"], df.fieldname) &&
|
||||
in_list(frappe.model.no_value_type, store.form.selected_field.fieldtype)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,87 @@
|
|||
<!-- Used as Fetch From Control -->
|
||||
<script setup>
|
||||
import { useStore } from "../../store";
|
||||
import { ref, computed, watch } from "vue";
|
||||
import { computedAsync } from "@vueuse/core";
|
||||
|
||||
let store = useStore();
|
||||
const props = defineProps(["df", "value", "modelValue"]);
|
||||
let emit = defineEmits(["update:modelValue"]);
|
||||
|
||||
let doctype = ref("");
|
||||
let fieldname = ref("");
|
||||
let doctypes = ref("");
|
||||
|
||||
let doctype_df = computed(() => {
|
||||
doctypes.value = store
|
||||
.get_updated_fields()
|
||||
.filter((df) => df.fieldtype == "Link")
|
||||
.filter((df) => df.options && df.fieldname != store.form.selected_field.fieldname)
|
||||
.sort((a, b) => a.options.localeCompare(b.options))
|
||||
.map((df) => ({
|
||||
label: `${df.options} (${df.fieldname})`,
|
||||
value: df.fieldname,
|
||||
doctype_name: df.options,
|
||||
}));
|
||||
|
||||
let options = [{ label: __("Select DocType"), value: "" }, ...doctypes.value];
|
||||
return { fieldtype: "Select", label: __("Fetch From"), options };
|
||||
});
|
||||
|
||||
let field_df = computedAsync(async () => {
|
||||
let options = [{ label: __("Select Field"), value: "" }];
|
||||
let df = { fieldtype: "Select", label: __("Fetch From"), options };
|
||||
if (!doctype.value) return df;
|
||||
let doctype_name = doctypes.value?.find((df) => df.value == doctype.value).doctype_name;
|
||||
if (!doctype_name) return df;
|
||||
|
||||
if (props.value.split(".")[0] != doctype.value) {
|
||||
fieldname.value = "";
|
||||
}
|
||||
|
||||
await frappe.model.with_doctype(doctype_name);
|
||||
|
||||
let fields = frappe.meta
|
||||
.get_docfields(doctype_name, null, {
|
||||
fieldtype: ["not in", frappe.model.no_value_type],
|
||||
})
|
||||
.sort((a, b) => {
|
||||
if (a.label && b.label) {
|
||||
return a.label.localeCompare(b.label);
|
||||
}
|
||||
})
|
||||
.map((df) => ({
|
||||
label: `${df.label || __("No Label")} (${df.fieldtype})`,
|
||||
value: df.fieldname,
|
||||
}));
|
||||
|
||||
df.options = df.options.concat(fields);
|
||||
return df;
|
||||
}, {});
|
||||
|
||||
watch(
|
||||
() => props.value,
|
||||
(value) => {
|
||||
[doctype.value, fieldname.value] = value?.split(".") || ["", ""];
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
watch([() => doctype.value, () => fieldname.value], ([doctype_value, fieldname_value]) => {
|
||||
let [doctype_name, field_name] = props.value?.split(".") || ["", ""];
|
||||
if (doctype_value != doctype_name || fieldname_value != field_name) {
|
||||
emit("update:modelValue", `${doctype_value}.${fieldname_value}`);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<SelectControl :df="doctype_df" :value="doctype" v-model="doctype" />
|
||||
<SelectControl
|
||||
v-if="doctype"
|
||||
:df="field_df"
|
||||
:value="fieldname"
|
||||
v-model="fieldname"
|
||||
:no_label="true"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -1,8 +1,7 @@
|
|||
<!-- Used as Text, Small Text & Long Text Control -->
|
||||
<script setup>
|
||||
import { useStore } from "../../store";
|
||||
import { useSlots, ref, computed, watch } from "vue";
|
||||
import { computedAsync } from "@vueuse/core";
|
||||
import { useSlots, computed } from "vue";
|
||||
|
||||
let store = useStore();
|
||||
const props = defineProps(["df", "value", "modelValue"]);
|
||||
|
|
@ -15,91 +14,10 @@ let height = computed(() => {
|
|||
}
|
||||
return "300px";
|
||||
});
|
||||
|
||||
let doctype = ref("");
|
||||
let fieldname = ref("");
|
||||
let doctypes = ref("");
|
||||
|
||||
let doctype_df = computed(() => {
|
||||
doctypes.value = store
|
||||
.get_updated_fields()
|
||||
.filter(df => df.fieldtype == "Link")
|
||||
.filter(df => df.options && df.fieldname != store.form.selected_field.fieldname)
|
||||
.sort((a, b) => a.options.localeCompare(b.options))
|
||||
.map(df => ({
|
||||
label: `${df.options} (${df.fieldname})`,
|
||||
value: df.fieldname,
|
||||
doctype_name: df.options
|
||||
}));
|
||||
|
||||
let options = [{ label: __("Select DocType"), value: "" }, ...doctypes.value];
|
||||
return { fieldtype: "Select", label: __("Fetch From"), options };
|
||||
});
|
||||
|
||||
let field_df = computedAsync(async () => {
|
||||
let options = [{ label: __("Select Field"), value: "" }];
|
||||
let df = { fieldtype: "Select", label: __("Fetch From"), options };
|
||||
if (!doctype.value) return df;
|
||||
let doctype_name = doctypes.value?.find(df => df.value == doctype.value).doctype_name;
|
||||
if (!doctype_name) return df;
|
||||
|
||||
if (props.value.split(".")[0] != doctype.value) {
|
||||
fieldname.value = "";
|
||||
}
|
||||
|
||||
await frappe.model.with_doctype(doctype_name);
|
||||
|
||||
let fields = frappe.meta
|
||||
.get_docfields(doctype_name, null, {
|
||||
fieldtype: ["not in", frappe.model.no_value_type]
|
||||
})
|
||||
.sort((a, b) => {
|
||||
if (a.label && b.label) {
|
||||
return a.label.localeCompare(b.label);
|
||||
}
|
||||
})
|
||||
.map(df => ({
|
||||
label: `${df.label || __("No Label")} (${df.fieldtype})`,
|
||||
value: df.fieldname
|
||||
}));
|
||||
|
||||
df.options = df.options.concat(fields);
|
||||
return df;
|
||||
}, {});
|
||||
|
||||
watch(
|
||||
() => props.value,
|
||||
value => {
|
||||
if (props.df.fieldname == "fetch_from") {
|
||||
[doctype.value, fieldname.value] = value?.split(".") || ["", ""];
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
watch([() => doctype.value, () => fieldname.value], ([doctype_value, fieldname_value]) => {
|
||||
let [doctype_name, field_name] = props.value?.split(".") || ["", ""];
|
||||
if (
|
||||
props.df.fieldname == "fetch_from" &&
|
||||
(doctype_value != doctype_name || fieldname_value != field_name)
|
||||
) {
|
||||
emit("update:modelValue", `${doctype_value}.${fieldname_value}`);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="df.fieldname == 'fetch_from'">
|
||||
<SelectControl :df="doctype_df" :value="doctype" v-model="doctype" />
|
||||
<SelectControl
|
||||
v-if="doctype"
|
||||
:df="field_df"
|
||||
:value="fieldname"
|
||||
v-model="fieldname"
|
||||
:no_label="true"
|
||||
/>
|
||||
</div>
|
||||
<div v-else class="control" :class="{ editable: slots.label }">
|
||||
<div class="control" :class="{ editable: slots.label }">
|
||||
<!-- label -->
|
||||
<div v-if="slots.label" class="field-controls">
|
||||
<slot name="label" />
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ import SignatureControl from "./components/controls/SignatureControl.vue";
|
|||
import TableControl from "./components/controls/TableControl.vue";
|
||||
import TextControl from "./components/controls/TextControl.vue";
|
||||
import TextEditorControl from "./components/controls/TextEditorControl.vue";
|
||||
import FetchFromControl from "./components/controls/FetchFromControl.vue";
|
||||
|
||||
export function registerGlobalComponents(app) {
|
||||
app.component("AttachControl", AttachControl)
|
||||
|
|
@ -52,5 +53,6 @@ export function registerGlobalComponents(app) {
|
|||
.component("TableMultiSelectControl", DataControl)
|
||||
.component("TextControl", TextControl)
|
||||
.component("TextEditorControl", TextEditorControl)
|
||||
.component("TimeControl", DataControl);
|
||||
.component("TimeControl", DataControl)
|
||||
.component("FetchFromControl", FetchFromControl);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue