This commit is contained in:
Viet An
2026-06-26 14:47:49 +07:00
parent 1262dc6d82
commit 6ff4112d66
96 changed files with 348 additions and 2936 deletions

View File

@@ -42,14 +42,23 @@
class="mr-3"
@click="add()"
>
<SvgIcon v-bind="{ name: 'add1.png', type: 'primary', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:add-rounded"
:size="20"
/>
</a>
<a @click="remove(v, i)">
<SvgIcon v-bind="{ name: 'bin1.svg', type: 'danger', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:delete-outline-rounded"
:size="20"
/>
</a>
<p class="mt-2">
<a @click="copyContent(v.text)">
<SvgIcon v-bind="{ name: 'copy.svg', type: 'primary', size: 22 }"></SvgIcon>
<Icon
name="material-symbols:content-copy-outline-rounded"
:size="20"
/>
</a>
</p>
</div>
@@ -126,23 +135,35 @@
class="mr-3"
@click="copyContent(v.link)"
>
<SvgIcon v-bind="{ name: 'copy.svg', type: 'primary', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:content-copy-outline-rounded"
:size="20"
/>
</a>
<a
class="mr-3"
:href="v.link"
target="_blank"
>
<SvgIcon v-bind="{ name: 'open.svg', type: 'primary', size: 20 }"></SvgIcon>
<Icon
name="mdi:launch"
:size="20"
/>
</a>
<a
class="mr-3"
@click="addLink()"
>
<SvgIcon v-bind="{ name: 'add1.png', type: 'primary', size: 18 }"></SvgIcon>
<Icon
name="material-symbols:add-rounded"
:size="20"
/>
</a>
<a @click="removeLink(v, i)">
<SvgIcon v-bind="{ name: 'bin1.svg', type: 'danger', size: 18 }"></SvgIcon>
<Icon
name="material-symbols:delete-outline-rounded"
:size="20"
/>
</a>
</div>
</div>
@@ -166,7 +187,10 @@
>
<span class="mr-3">{{ v.text }}</span>
<a @click="copyContent(v.text)">
<SvgIcon v-bind="{ name: 'copy.svg', type: 'primary', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:content-copy-outline-rounded"
:size="20"
/>
</a>
</div>
</div>
@@ -208,7 +232,10 @@
>{{ v.link }}</a
>
<a @click="copyContent(v.link)">
<SvgIcon v-bind="{ name: 'copy.svg', type: 'primary', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:content-copy-outline-rounded"
:size="20"
/>
</a>
</div>
</template>

View File

@@ -35,13 +35,19 @@
class="ml-3"
@click="edit(v)"
>
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'gray', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:edit-outline-rounded"
:size="20"
/>
</a>
<a
class="ml-3"
@click="askConfirm(v, i)"
>
<SvgIcon v-bind="{ name: 'bin.svg', type: 'gray', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:delete-outline-rounded"
:size="20"
/>
</a>
</template>
</span>

View File

@@ -40,7 +40,10 @@
v-if="finalLink"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'open.svg', type: 'primary', size: 24 }" />
<Icon
name="mdi:launch"
:size="20"
/>
</span>
</a>
@@ -51,7 +54,10 @@
v-if="finalLink"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'download.svg', type: 'primary', size: 24 }" />
<Icon
name="material-symbols:download-rounded"
:size="20"
/>
</span>
</a>
</div>

View File

@@ -1,67 +0,0 @@
<template>
<div class="p-5">
<!-- <h3 class="title is-4 mb-5 has-text-centered">
{{ isVietnamese ? "Chọn loại khách hàng" : "Select Customer Type" }}
</h3> -->
<div class="columns is-multiline">
<div class="column is-6">
<button
class="button is-large is-fullwidth"
style="height: 100px"
@click="selectType('individual')"
>
<div class="has-text-centered">
<div class="">
<SvgIcon v-bind="{ name: 'user.svg', type: 'black', size: 40 }"></SvgIcon>
</div>
<div class="title is-6 mb-0">
{{ isVietnamese ? "Cá nhân" : "Individual" }}
</div>
</div>
</button>
</div>
<div class="column is-6">
<button
class="button is-large is-fullwidth"
style="height: 100px"
@click="selectType('company')"
>
<div class="has-text-centered">
<div class="">
<SvgIcon v-bind="{ name: 'building.svg', type: 'black', size: 40 }"></SvgIcon>
</div>
<div class="title is-6 mb-0">
{{ isVietnamese ? "Doanh nghiệp" : "Company" }}
</div>
</div>
</button>
</div>
</div>
</div>
</template>
<script setup>
import { computed } from "vue";
import { useStore } from "~/stores/index";
const store = useStore();
const lang = computed(() => store.lang);
const isVietnamese = computed(() => lang.value === "vi");
const emit = defineEmits(["select", "modalevent"]);
const props = defineProps({
application: Object,
});
function selectType(type) {
// Emit event qua modalevent để Modal có thể forward
emit("modalevent", { name: "select", data: type });
}
</script>
<style scoped>
.button.is-large.is-fullwidth:hover {
background-color: #3292ec !important;
}
</style>

View File

@@ -393,15 +393,12 @@
<span>Paste</span>
</button>
</div>
<div>
<textarea
class="textarea fs-13"
style="font-family: monospace"
rows="4"
v-model="text"
@dblclick="doCheck"
></textarea>
</div>
<textarea
class="textarea fs-13 is-family-monospace"
rows="4"
v-model="text"
@dblclick="doCheck"
></textarea>
<p class="mt-5">
<span class="icon-text">
<span class="fs-17 font-semibold">Replace</span>

View File

@@ -134,48 +134,51 @@
</template>
<template v-else-if="tab.code === 'script' && ['bgcolor', 'color', 'textsize'].find((x) => x === sideBar)">
<p class="my-4 mx-4">
<a
@click="copyContent(script ? script : '')"
class="mr-6"
<div class="buttons has-addons mb-3">
<button
@click="copyContent(script || '')"
class="button is-primary is-light fs-14"
>
<span class="icon-text">
<SvgIcon
class="mr-2"
v-bind="{ name: 'copy.svg', type: 'primary', siz: 18 }"
></SvgIcon>
<span class="fs-16">Copy</span>
<span class="icon">
<Icon
name="material-symbols:content-copy-outline-rounded"
:size="18"
/>
</span>
</a>
<a
<span>Copy</span>
</button>
<button
@click="paste()"
class="mr-6"
class="button is-primary is-light fs-14"
>
<span class="icon-text">
<SvgIcon
class="mr-2"
v-bind="{ name: 'pen1.svg', type: 'primary', siz: 18 }"
></SvgIcon>
<span class="fs-16">Paste</span>
<span class="icon">
<Icon
name="material-symbols:content-paste-rounded"
:size="18"
/>
</span>
</a>
</p>
<div class="mx-4">
<textarea
class="textarea fs-14"
rows="8"
v-model="script"
@change="checkScript()"
@dblclick="doCheck"
></textarea>
<span>Paste</span>
</button>
</div>
<p class="mt-5 mx-4">
<span class="icon-text fsb-18">
Replace
<SvgIcon v-bind="{ name: 'right.svg', type: 'dark', size: 22 }"></SvgIcon>
<textarea
class="textarea fs-13 is-family-monospace"
rows="4"
v-model="script"
@change="checkScript()"
@dblclick="doCheck"
></textarea>
<p class="mt-5">
<span class="icon-text">
<span class="fs-17 font-semibold">Replace</span>
<span class="icon">
<Icon
name="material-symbols:arrow-forward-ios-rounded"
:size="18"
/>
</span>
</span>
</p>
<div class="field is-grouped mx-4 mt-4">
<div class="field is-grouped mt-4">
<div class="control">
<p class="fsb-14 mb-1">Đoạn text</p>
<input
@@ -194,22 +197,32 @@
v-model="target"
/>
</div>
<div class="control pl-5">
<div class="control">
<label
class="label"
style="opacity: 0"
>Hidden</label
>
<button
class="button is-primary is-rounded is-outlined mt-5"
class="button is-primary is-light"
@click="replace()"
>
Replace
</button>
</div>
</div>
<p class="mt-5 pt-2 mx-4">
<span class="icon-text fsb-18">
Thay đổi màu
<SvgIcon v-bind="{ name: 'right.svg', type: 'dark', size: 22 }"></SvgIcon>
<p class="mt-5">
<span class="icon-text">
<span class="fs-17 font-semibold">Thay đổi màu</span>
<span class="icon">
<Icon
name="material-symbols:arrow-forward-ios-rounded"
:size="18"
/>
</span>
</span>
</p>
<p class="mx-4 mt-4">
<p class="mt-4">
<button
class="button is-primary is-rounded"
@click="changeScript()"

View File

@@ -38,7 +38,13 @@
</div>
<div class="control pr-2 mr-5">
<span class="icon-text">
<SvgIcon v-bind="{ name: 'sigma.svg', type: 'primary', size: 20 }"></SvgIcon>
<span class="icon">
<Icon
name="mdi:sigma"
:size="20"
class="has-text-primary"
/>
</span>
<span class="fsb-18 has-text-primary">{{ pivotData.length }}</span>
</span>
</div>

View File

@@ -12,13 +12,19 @@
class="mr-1"
@click="previousYear()"
>
<SvgIcon v-bind="{ name: 'doubleleft.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-double-arrow-left"
:size="18"
/>
</a>
<a
@click="previousMonth()"
v-if="type === 'days'"
>
<SvgIcon v-bind="{ name: 'left1.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-arrow-left"
:size="18"
/>
</a>
</div>
<div class="control is-expanded has-text-centered">
@@ -43,10 +49,16 @@
@click="nextMonth()"
v-if="type === 'days'"
>
<SvgIcon v-bind="{ name: 'right.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-arrow-right"
:size="18"
/>
</a>
<a @click="nextYear()">
<SvgIcon v-bind="{ name: 'doubleright.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-double-arrow-right"
:size="18"
/>
</a>
</div>
</div>
@@ -84,7 +96,10 @@
:class="`pt-1 ${j === m.event.length - 1 ? '' : 'border-bottom'}`"
v-for="(h, j) in m.event"
>
<SvgIcon v-bind="{ name: h.icon, type: h.color, size: 16 }"></SvgIcon>
<Icon
:name="h.icon"
:size="18"
/>
<a
class="ml-3"
@click="openEvent(h)"

View File

@@ -1,27 +1,39 @@
<template>
<div class="columns mx-0">
<EventSummary />
<div
class="column is-narrow"
v-if="1 < 0"
>
<EventSummary></EventSummary>
</div>
></div>
<div class="column">
<div class="mb-4">
<span class="fsb-17 mr-4">{{ `T${vmonth}/${vyear}` }}</span>
<a
class="mr-2"
@click="previous()"
><SvgIcon v-bind="{ name: 'left1.svg', type: 'dark', size: 18 }"></SvgIcon
></a>
>
<Icon
name="material-symbols:arrow-back-ios-new-rounded"
:size="18"
/>
</a>
<a
class="mr-3"
@click="next()"
><SvgIcon v-bind="{ name: 'right.svg', type: 'dark', size: 18 }"></SvgIcon
></a>
<a @click="refresh()"><SvgIcon v-bind="{ name: 'refresh.svg', type: 'dark', size: 18 }"></SvgIcon></a>
>
<Icon
name="material-symbols:arrow-forward-ios-rounded"
:size="18"
/>
</a>
<a @click="refresh()">
<Icon
name="material-symbols:refresh-rounded"
:size="18"
/>
</a>
</div>
<EventDetail v-bind="{ events: events, vyear: vyear, vmonth: vmonth }"></EventDetail>
<EventDetail v-bind="{ events, vyear, vmonth }" />
</div>
</div>
</template>

View File

@@ -9,13 +9,19 @@
class="mr-1"
@click="previousYear()"
>
<SvgIcon v-bind="{ name: 'doubleleft.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-double-arrow-left"
:size="24"
/>
</a>
<a
@click="previousMonth()"
v-if="type === 'days'"
>
<SvgIcon v-bind="{ name: 'left1.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-arrow-left"
:size="24"
/>
</a>
</div>
<div class="control is-expanded has-text-centered">
@@ -40,10 +46,16 @@
@click="nextMonth()"
v-if="type === 'days'"
>
<SvgIcon v-bind="{ name: 'right.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-arrow-right"
:size="24"
/>
</a>
<a @click="nextYear()">
<SvgIcon v-bind="{ name: 'doubleright.svg', type: 'gray', size: 18 }"></SvgIcon>
<Icon
name="ic:baseline-keyboard-double-arrow-right"
:size="24"
/>
</a>
</div>
</div>
@@ -63,16 +75,15 @@
:key="i"
>
<div
class="column px-3 fs-14"
v-for="(m, h) in v.dates"
:key="h"
style="padding-top: 1px; padding-bottom: 1px"
class="column p-0.5 fs-14"
>
<a v-if="m.event && m.currentMonth === m.mothCondition">
<Tooltip v-bind="{ html: m.event.html, tooltip: m.event.tooltip }"></Tooltip>
</a>
<span
class="has-background-findata has-text-white px-1 py-1"
class="has-background-primary-soft p-1"
v-else-if="m.date === today"
>{{ m.dayPrint }}</span
>

View File

@@ -1,140 +0,0 @@
<template>
<div class="modal-card">
<header
class="modal-card-head"
:class="headerClass"
>
<p class="modal-card-title has-text-white">
<span class="icon-text">
<span class="icon">
<SvgIcon
:name="iconName"
type="white"
:size="24"
/>
</span>
<span>{{ title }}</span>
</span>
</p>
</header>
<section class="modal-card-body">
<div class="field">
<label class="label">{{ label }}</label>
<div class="control">
<textarea
class="textarea"
v-model="note"
:placeholder="placeholder"
></textarea>
</div>
<p
v-if="error"
class="help is-danger"
>
{{ error }}
</p>
</div>
</section>
<footer class="modal-card-foot is-justify-content-flex-end">
<button
class="button"
@click="$emit('close')"
>
{{ cancelText }}
</button>
<button
class="button"
:class="buttonClass"
@click="confirm"
>
{{ confirmText }}
</button>
</footer>
</div>
</template>
<script>
import { useStore } from "~/stores/index";
export default {
props: {
title: {
type: String,
default: "Nhập nội dung",
},
label: {
type: String,
default: "Ghi chú",
},
placeholder: {
type: String,
default: "Nhập nội dung...",
},
type: {
type: String,
default: "primary", // primary, warning, danger
},
confirmText: {
type: String,
default: "Xác nhận",
},
cancelText: {
type: String,
default: "Hủy",
},
},
emits: ["close", "modalevent"],
setup() {
const store = useStore();
return { store };
},
data() {
return {
note: "",
error: "",
};
},
computed: {
isVietnamese() {
return this.store.lang === "vi";
},
headerClass() {
const colorMap = {
primary: "has-background-primary",
warning: "has-background-warning",
danger: "has-background-danger",
};
return colorMap[this.type] || "has-background-primary";
},
buttonClass() {
const colorMap = {
primary: "is-primary",
warning: "is-warning",
danger: "is-danger",
};
return colorMap[this.type] || "is-primary";
},
iconName() {
const iconMap = {
primary: "edit.svg",
warning: "warning.svg",
danger: "alert.svg",
};
return iconMap[this.type] || "edit.svg";
},
},
methods: {
confirm() {
if (!this.note.trim()) {
this.error = this.isVietnamese ? "Nội dung không được để trống." : "Content cannot be empty.";
return;
}
this.$emit("modalevent", {
name: "noteConfirm",
data: { note: this.note },
});
this.$emit("close");
},
},
};
</script>

View File

@@ -66,7 +66,11 @@
@click="handleOpenModal"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'save.svg', type: 'primary', size: 18 }"></SvgIcon>
<Icon
name="material-symbols:save-outline-rounded"
:size="18"
class="has-text-primary"
/>
</span>
</button>
<button
@@ -76,7 +80,10 @@
:disabled="loading"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'trash.svg', type: 'white', size: 18 }"></SvgIcon>
<Icon
name="material-symbols:delete-outline-rounded"
:size="18"
/>
</span>
</button>
</div>

View File

@@ -9,8 +9,13 @@
class="button is-primary"
@click="openNewJobForm"
>
<SvgIcon v-bind="{ name: 'add4.svg', type: 'white', size: 18 }" />
<span class="ml-2">Add New Job</span>
<span class="icon">
<Icon
name="material-symbols:add-rounded"
:size="18"
/>
</span>
<span>Add New Job</span>
</button>
</div>
</div>
@@ -71,7 +76,12 @@
class="button is-small"
@click="openEditJobForm(job)"
>
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'primary', size: 18 }" />
<span class="icon">
<Icon
name="material-symbols:edit-outline-rounded"
:size="18"
/>
</span>
</button>
</div>
<div class="control">
@@ -79,7 +89,12 @@
class="button is-danger is-small"
@click="confirmDelete(job)"
>
<SvgIcon v-bind="{ name: 'trash.svg', type: 'white', size: 18 }" />
<span class="icon">
<Icon
name="material-symbols:delete-outline-rounded"
:size="18"
/>
</span>
</button>
</div>
</div>

View File

@@ -15,7 +15,7 @@
@click="removeMapping(mapIndex)"
>
<span class="icon is-small">
<SvgIcon v-bind="{ name: 'bin1.svg', type: 'white', size: 16 }"></SvgIcon>
<Icon name="material-symbols:delete-outline-rounded" />
</span>
</button>
</div>
@@ -140,7 +140,12 @@
class="button is-danger is-light"
@click="removeField(mapIndex, fieldIndex as number)"
>
<SvgIcon v-bind="{ name: 'bin1.svg', type: 'primary' }"></SvgIcon>
<span class="icon">
<Icon
name="material-symbols:delete-outline-rounded"
:size="20"
/>
</span>
</button>
</div>
</div>
@@ -157,11 +162,13 @@
class="button is-primary"
@click="addMapping"
>
<SvgIcon
class="mr-2"
v-bind="{ name: 'add4.svg', type: 'white', size: 18 }"
/>
Add Mapping
<span class="icon">
<Icon
name="material-symbols:add-rounded"
:size="18"
/>
</span>
<span>Add Mapping</span>
</button>
</div>
</template>

View File

@@ -75,12 +75,9 @@
opacity: 0.15,
}"
>
<SvgIcon
v-bind="{
name: 'image.svg',
type: 'black',
size: 180,
}"
<Icon
name="material-symbols:image-outline-rounded"
:size="100"
/>
</div>
</div>

View File

@@ -88,7 +88,7 @@
class="tag is-warning"
>
<span class="icon is-small">
<SvgIcon v-bind="{ name: 'loading.svg', type: 'white', size: 12 }" />
<Icon name="svg-spinners:180-ring-with-bg" />
</span>
<span>Pending</span>
</span>

View File

@@ -54,7 +54,7 @@
@click="handleCreateNew"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'add4.svg', type: 'gray', size: 16 }"></SvgIcon>
<Icon name="material-symbols:add-rounded" />
</span>
<span>Create New</span>
</button>
@@ -69,13 +69,7 @@
class="icon"
v-else
>
<SvgIcon
v-bind="{
name: isEditMode ? 'save.svg' : 'add4.svg',
type: 'white',
size: 16,
}"
></SvgIcon>
<Icon :name="isEditMode ? 'material-symbols:edit-outline-rounded' : 'material-symbols:add-rounded'" />
</span>
<span>{{
loading

View File

@@ -33,19 +33,19 @@
class="icon"
v-if="loading"
>
<SvgIcon v-bind="{ name: 'loading.svg', type: 'white', size: 16 }"></SvgIcon>
<Icon name="svg-spinners:180-ring-with-bg" />
</span>
<span
class="icon"
v-else-if="isEditMode"
>
<SvgIcon v-bind="{ name: 'save.svg', type: 'white', size: 16 }"></SvgIcon>
<Icon name="material-symbols:save-outline-rounded" />
</span>
<span
class="icon"
v-else
>
<SvgIcon v-bind="{ name: 'add4.svg', type: 'white', size: 16 }"></SvgIcon>
<Icon name="material-symbols:add-rounded" />
</span>
<span>{{
loading ? (isEditMode ? "Updating..." : "Creating...") : isEditMode ? "Update Template" : "Create Template"
@@ -61,13 +61,13 @@
class="icon"
v-if="loadingCreate"
>
<SvgIcon v-bind="{ name: 'loading.svg', type: 'white', size: 16 }" />
<Icon name="svg-spinners:180-ring-with-bg" />
</span>
<span
class="icon"
v-else
>
<SvgIcon v-bind="{ name: 'add4.svg', type: 'white', size: 16 }"></SvgIcon>
<Icon name="material-symbols:add-rounded" />
</span>
<span>{{ loadingCreate ? "Creating..." : "Create" }}</span>
</button>

View File

@@ -131,7 +131,7 @@
class="button is-normal"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'add4.svg', type: 'black', size: 16 }"></SvgIcon>
<Icon name="material-symbols:add-rounded" />
</span>
<span>Thêm liên kết</span>
</button>
@@ -176,7 +176,7 @@
style="border-radius: 8px"
>
<span class="icon">
<SvgIcon v-bind="{ name: 'trash.svg', type: 'white', size: 16 }"></SvgIcon>
<Icon name="material-symbols:delete-outline-rounded" />
</span>
</button>
</div>
@@ -230,7 +230,7 @@
<span v-if="loading">Đang gửi</span>
<template v-else>
<span class="icon">
<SvgIcon v-bind="{ name: 'send.svg', type: 'white', size: 18 }" />
<Icon name="material-symbols:send-rounded" />
</span>
<span>Gửi email</span>
</template>

View File

@@ -20,37 +20,37 @@
class="ml-5"
v-if="!$empty(v.match)"
>
<SvgIcon
v-bind="{
name: v.match ? 'check2.svg' : 'error.svg',
type: v.match ? 'blue' : 'danger',
size: 26,
}"
></SvgIcon>
<Icon
:name="
v.match ? 'material-symbols:check-rounded' : 'material-symbols:error-circle-rounded-outline-sharp'
"
:size="26"
:class="`has-text-${v.match ? 'primary' : 'danger'}`"
/>
</span>
<span
class="ml-5"
v-if="!$empty(v.auth)"
>
<SvgIcon
v-bind="{
name: v.auth ? 'check2.svg' : 'error.svg',
type: v.auth ? 'blue' : 'danger',
size: 26,
}"
></SvgIcon>
<Icon
:name="
v.auth ? 'material-symbols:check-rounded' : 'material-symbols:error-circle-rounded-outline-sharp'
"
:size="26"
:class="`has-text-${v.auth ? 'primary' : 'danger'}`"
/>
</span>
<span
class="ml-5"
v-if="!$empty(v.expiry)"
>
<SvgIcon
v-bind="{
name: v.expiry ? 'error.svg' : 'check2.svg',
type: v.expiry ? 'danger' : 'blue',
size: 26,
}"
></SvgIcon>
<Icon
:name="
v.expiry ? 'material-symbols:error-circle-rounded-outline-sharp' : 'material-symbols:check-rounded'
"
:size="26"
:class="`has-text-${v.expiry ? 'danger' : 'primary'}`"
/>
</span>
</span>
</td>

View File

@@ -22,13 +22,17 @@
:class="['button px-5', { 'is-primary': layout === layoutMode }]"
@click="layoutMode = layout"
>
<SvgIcon
v-bind="{
name: `${layout}.svg`,
type: layout === layoutMode ? 'white' : 'primary',
size: 20,
}"
/>
<span class="icon">
<Icon
:name="
layout === 'grid'
? 'material-symbols:grid-view-outline-rounded'
: 'material-symbols:format-list-bulleted-rounded'
"
:size="20"
:class="`has-text-${layout === layoutMode ? 'white' : 'primary'}`"
/>
</span>
</button>
</div>
<div
@@ -83,13 +87,19 @@
class="mr-3"
@click="excel()"
>
<SvgIcon v-bind="{ name: 'excel.png', type: 'black', size: 20 }"></SvgIcon>
<Icon
name="mdi:microsoft-excel"
:size="20"
/>
</a>
<a
v-if="$getEditRights()"
@click="importData()"
>
<SvgIcon v-bind="{ name: 'upload.svg', type: 'black', size: 20 }"></SvgIcon>
<Icon
name="material-symbols:upload-rounded"
:size="20"
/>
</a>
</span>
</th>
@@ -155,14 +165,20 @@
class="button is-rounded"
style="left: 24px"
>
<SvgIcon v-bind="{ name: 'left1.svg', type: 'black', size: 20 }" />
<Icon
name="material-symbols:arrow-back-ios-new-rounded"
:size="20"
/>
</button>
<button
@click="showNextImage()"
class="button is-rounded"
style="right: 24px"
>
<SvgIcon v-bind="{ name: 'right.svg', type: 'black', size: 20 }" />
<Icon
name="material-symbols:arrow-forward-ios-rounded"
:size="20"
/>
</button>
</div>
<div class="gallery-count">
@@ -201,6 +217,7 @@ const { dealer } = useStore();
const { $snackbar, $getdata, $insertapi, $deleteapi, $findapi, $getapi, $dayjs, $unique } = useNuxtApp();
const layoutModes = { GRID: "grid", LIST: "list" };
const layoutMode = ref(layoutModes.GRID);
const convertToWebp = ref(false);

View File

@@ -3,13 +3,13 @@
class="mr-3"
@click="$emit('edit')"
>
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'dark', size: 16 }"></SvgIcon>
<Icon name="material-symbols:edit-outline-rounded" />
</a>
<a
@click="$emit('remove')"
v-if="attrs.onRemove"
>
<SvgIcon v-bind="{ name: 'bin1.svg', type: 'dark', size: 16 }"></SvgIcon>
<Icon name="material-symbols:delete-outline-rounded" />
</a>
</template>
<script setup>

View File

@@ -1,52 +0,0 @@
<template>
<a
v-if="row.note"
@click="showNote()"
>
<SvgIcon v-bind="{ name: 'edit2.svg', type: 'findata', size: 20 }"></SvgIcon>
</a>
<a
v-else
@click="showNote()"
>
<span class="tooltip">
<span class="dot-twitter">+</span>
<span
class="tooltiptext"
style="min-width: max-content"
>{{ label }}</span
>
</span>
</a>
</template>
<script>
import { useStore } from "~/stores/index";
export default {
setup() {
const store = useStore();
return { store };
},
props: ["row", "pagename"],
data() {
return {
label: this.store.lang === "en" ? "Note" : "Ghi chú",
};
},
methods: {
showNote() {
this.$emit("clickevent", {
name: "dataevent",
data: {
modal: {
title: this.label,
height: "330px",
width: "700px",
component: "common/Note",
vbind: { row: this.row, pagename: this.pagename },
},
},
});
},
},
};
</script>

View File

@@ -74,7 +74,10 @@
</div>
<div class="control ml-5">
<a @click="openEditor()">
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'gray', size: 22 }"></SvgIcon>
<Icon
name="material-symbols:edit-outline-rounded"
:size="20"
/>
</a>
</div>
</div>
@@ -87,7 +90,10 @@
</div>
<div class="control ml-5">
<a @click="openEditor()">
<SvgIcon v-bind="{name: 'pen1.svg', type: 'gray', size: 22}"></SvgIcon>
<Icon
name="material-symbols:edit-outline-rounded"
:size="20"
/>
</a>
</div>
</div>
@@ -132,8 +138,11 @@
class="button"
@click="editDetail('detail')"
>
<span>
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'gray', size: 17 }"></SvgIcon>
<span class="icon">
<Icon
name="material-symbols:edit-outline-rounded"
:size="20"
/>
</span>
</button>
</div>
@@ -163,8 +172,11 @@
</div>
<div class="control">
<button class="button" @click="editDetail('detail_en')">
<span>
<SvgIcon v-bind="{name: 'pen1.svg', type: 'gray', size: 17}"></SvgIcon>
<span class="icon">
<Icon
name="material-symbols:edit-outline-rounded"
:size="20"
/>
</span>
</button>
</div>

View File

@@ -21,12 +21,13 @@
class="button"
@click="showpass = !showpass"
>
<SvgIcon
v-bind="{
name: showpass ? 'eye-off.svg' : 'view.svg',
type: 'gray',
size: 24,
}"
<Icon
:name="
showpass
? 'material-symbols:visibility-off-outline-rounded'
: 'material-symbols:visibility-outline-rounded'
"
:size="20"
/>
</a>
</div>
@@ -60,12 +61,13 @@
class="button"
@click="showpass = !showpass"
>
<SvgIcon
v-bind="{
name: showpass ? 'eye-off.svg' : 'view.svg',
type: 'gray',
size: 24,
}"
<Icon
:name="
showpass
? 'material-symbols:visibility-off-outline-rounded'
: 'material-symbols:visibility-outline-rounded'
"
:size="20"
/>
</a>
</div>
@@ -98,12 +100,13 @@
class="button"
@click="showpass = !showpass"
>
<SvgIcon
v-bind="{
name: showpass ? 'eye-off.svg' : 'view.svg',
type: 'gray',
size: 24,
}"
<Icon
:name="
showpass
? 'material-symbols:visibility-off-outline-rounded'
: 'material-symbols:visibility-outline-rounded'
"
:size="20"
/>
</a>
</div>

View File

@@ -104,14 +104,14 @@
class="button"
@click="showpass = !showpass"
>
<SvgIcon
v-bind="{ name: 'eye-off.svg', type: 'dark', size: 22 }"
v-if="showpass"
></SvgIcon>
<SvgIcon
v-bind="{ name: 'view.svg', type: 'dark', size: 22 }"
v-else
></SvgIcon>
<Icon
:name="
showpass
? 'material-symbols:visibility-outline-rounded'
: 'material-symbols:visibility-off-outline-rounded'
"
:size="20"
/>
</a>
</div>
<p

View File

@@ -25,14 +25,14 @@
class="button"
@click="showpass = !showpass"
>
<SvgIcon
v-bind="{ name: 'eye-off.svg', type: 'dark', size: 22 }"
v-if="showpass"
></SvgIcon>
<SvgIcon
v-bind="{ name: 'view.svg', type: 'dark', size: 22 }"
v-else
></SvgIcon>
<Icon
:name="
showpass
? 'material-symbols:visibility-off-outline-rounded'
: 'material-symbols:visibility-outline-rounded'
"
:size="20"
/>
</a>
</div>
</div>
@@ -61,14 +61,14 @@
class="button"
@click="showpass = !showpass"
>
<SvgIcon
v-bind="{ name: 'eye-off.svg', type: 'dark', size: 22 }"
v-if="showpass"
></SvgIcon>
<SvgIcon
v-bind="{ name: 'view.svg', type: 'dark', size: 22 }"
v-else
></SvgIcon>
<Icon
:name="
showpass
? 'material-symbols:visibility-off-outline-rounded'
: 'material-symbols:visibility-outline-rounded'
"
:size="20"
/>
</a>
</div>
</div>

View File

@@ -21,7 +21,6 @@ import MenuAction from "~/components/menu/MenuAction.vue";
import MenuPhone from "~/components/menu/MenuPhone.vue";
import MenuParam from "~/components/menu/MenuParam.vue";
import MenuAdd from "~/components/menu/MenuAdd.vue";
import MenuNote from "~/components/menu/MenuNote.vue";
import MenuFile from "~/components/menu/MenuFile.vue";
import CustomerForm from "~/components/customer/CustomerForm.vue";
@@ -77,7 +76,6 @@ const components = {
MenuParam,
FormatDate,
MenuAdd,
MenuNote,
MenuFile,
Dashboard,
Orders,