erp/web
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changes

Browse Source
This commit is contained in:
Viet An
2026-07-09 16:45:48 +07:00
parent 42124d4071
commit df4ed4bd4d
20 changed files with 726 additions and 964 deletions
Download Patch File Download Diff File Expand all files Collapse all files

286
app/components/marketing/email/MappingConfigurator.vue
View File

@@ -1,161 +1,151 @@
<template>
<div class="box">
<div>
<div
v-for="(mapping, mapIndex) in localMappings"
:key="mapIndex"
class="mb-5 p-4 border"
class="card"
style="border: 1px solid var(--bulma-grey-90)"
>
<div class="level">
<div class="level-left">
<h5 class="title is-5">Mapping {{ mapIndex + 1 }}: {{ mapping.alias }}</h5>
</div>
<div class="level-right">
<button
class="button is-danger is-small"
@click="removeMapping(mapIndex)"
>
<span class="icon is-small">
<Icon name="material-symbols:delete-outline-rounded" />
</span>
</button>
</div>
</div>
<div class="columns is-multiline">
<div class="column is-6">
<div class="field">
<label class="label">Alias</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.alias"
@input="update"
/>
</div>
</div>
</div>
<div class="column is-6">
<div class="field">
<label class="label">Model</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.model"
@input="update"
placeholder="e.g., app.Transaction"
/>
</div>
</div>
</div>
<div class="column is-6">
<div class="field">
<label class="label">Lookup Field</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.lookup_field"
@input="update"
placeholder="e.g., id"
/>
</div>
</div>
</div>
<div class="column is-6">
<div class="field">
<label class="label">Lookup Value From</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.lookup_value_from"
@input="update"
placeholder="e.g., transaction_id or transaction.customer.id"
/>
</div>
</div>
</div>
<div class="column is-6">
<div class="field">
<label class="label">Type</label>
<div class="control">
<div class="select is-fullwidth">
<select
v-model="mapping.type"
@change="update"
>
<option value="object">Object</option>
<option value="list">List</option>
</select>
</div>
</div>
</div>
</div>
<div class="column is-6">
<div class="field">
<label class="label">Is Trigger Object?</label>
<div class="control">
<label class="checkbox">
<input
type="checkbox"
v-model="mapping.is_trigger_object"
@change="update"
/>
Yes
</label>
</div>
</div>
</div>
</div>
<hr />
<h6 class="title is-6">Fields</h6>
<div
v-for="(field, fieldIndex) in mapping.fields"
:key="fieldIndex"
class="field has-addons"
>
<div class="control">
<input
class="input"
type="text"
v-model="field.placeholder"
@input="update"
placeholder="[placeholder]"
/>
</div>
<div class="control is-expanded">
<input
class="input"
type="text"
v-model="field.source"
@input="update"
placeholder="source.field.name"
/>
</div>
<div class="control">
<div class="card-content p-4">
<div class="block is-flex is-gap-1 is-justify-content-space-between is-align-items-center">
<h5 class="fs-17 font-semibold">Mapping {{ mapIndex + 1 }}: {{ mapping.alias }}</h5>
<button
class="button is-danger is-light"
@click="removeField(mapIndex, fieldIndex as number)"
@click="removeMapping(mapIndex)"
>
<span class="icon">
<Icon
name="material-symbols:delete-outline-rounded"
:size="20"
:size="18"
/>
</span>
</button>
</div>
<div class="fixed-grid">
<div class="grid">
<div class="cell">
<label class="label">Alias</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.alias"
@input="update"
/>
</div>
</div>
<div class="cell">
<label class="label">Model</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.model"
@input="update"
placeholder="e.g., app.Transaction"
/>
</div>
</div>
<div class="cell">
<label class="label">Lookup Field</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.lookup_field"
@input="update"
placeholder="e.g., id"
/>
</div>
</div>
<div class="cell">
<label class="label">Lookup Value From</label>
<div class="control">
<input
class="input"
type="text"
v-model="mapping.lookup_value_from"
@input="update"
placeholder="e.g., transaction_id or transaction.customer.id"
/>
</div>
</div>
<div class="cell">
<label class="label">Type</label>
<div class="control">
<div class="select is-fullwidth">
<select
v-model="mapping.type"
@change="update"
>
<option value="object">Object</option>
<option value="list">List</option>
</select>
</div>
</div>
</div>
<div class="cell">
<label class="label">Is Trigger Object?</label>
<div class="control">
<label class="checkbox">
<input
type="checkbox"
v-model="mapping.is_trigger_object"
@change="update"
/>
Yes
</label>
</div>
</div>
</div>
</div>
<hr />
<p class="label">Fields</p>
<div
v-for="(field, fieldIndex) in mapping.fields"
:key="fieldIndex"
class="field has-addons"
>
<div class="control">
<input
class="input"
type="text"
v-model="field.placeholder"
@input="update"
placeholder="[placeholder]"
/>
</div>
<div class="control is-expanded">
<input
class="input"
type="text"
v-model="field.source"
@input="update"
placeholder="source.field.name"
/>
</div>
<div class="control">
<button
class="button is-danger is-light"
@click="removeField(mapIndex, fieldIndex as number)"
>
<span class="icon">
<Icon
name="material-symbols:delete-outline-rounded"
:size="20"
/>
</span>
</button>
</div>
</div>
<button
class="button is-small is-light"
@click="addField(mapIndex)"
>
<span class="icon is-small">+</span>
<span>Add Field</span>
</button>
</div>
<button
class="button is-small is-light"
@click="addField(mapIndex)"
>
<span class="icon is-small">+</span>
<span>Add Field</span>
</button>
</div>
<button
@@ -174,8 +164,6 @@
</template>
<script setup lang="ts">
import { ref, watch } from "vue";
const props = defineProps({
mappings: {
type: Array,
@@ -260,13 +248,3 @@ const update = () => {
emit("update:mappings", reformatMappingsForEmit());
};
</script>
<style scoped>
.box {
padding: 1.5rem;
}
.border {
border: 1px solid #dbdbdb;
border-radius: 4px;
}
</style>