minhnt/NSG_PORTAL_V2
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

thainv-dev: Fix Ui

Browse Source
This commit is contained in:
nguyen van thai
2024-06-25 09:08:44 +07:00
parent ab3419bd5f
commit fcb826a7c6
9 changed files with 25 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/dynamic-page/page-component/templates/articles/layouts/Card.vue
+1 -1
View File
@@ -68,7 +68,7 @@ const drop = (e: any) => {
<div>
<nuxt-link :to="`bai-viet/${parseData?.slug}`"
v-if="!LAYOUT_PARSE['HIDE'] || !LAYOUT_PARSE['HIDE'].includes('title')"
class="line-clamp hover:text-primary-600"
class="line-clamp hover:text-primary-600 font-bold font-archivo"
:style="[
LAYOUT_PARSE['fontSizeTitle'] && `font-size: ${LAYOUT_PARSE['fontSizeTitle']}px`,
LAYOUT_PARSE['fontWeightTitle'] && `font-weight: ${LAYOUT_PARSE['fontWeightTitle']}`,
components/dynamic-page/page-component/templates/articles/layouts/details/General.vue
+5 -5
View File
@@ -54,9 +54,9 @@ onMounted(async () => {
clickElement("author", "author", "data-code");
let detailEmagazine = document.querySelector('div[layout="ARTICLE_DETAIL_EMAGAZINE"]');
let breakcrumb = document.querySelector('div[layout="BREADCRUM_DEFAULT"]');
if (detailEmagazine && breakcrumb) {
breakcrumb.classList.add("lg:max-w-640px", "mx-auto");
let breadcrumb = document.querySelector('div[layout="BREADCRUM_DEFAULT"]');
if (detailEmagazine && breadcrumb) {
breadcrumb.classList.add("lg:max-w-640px", "mx-auto");
}
document.documentElement.style.setProperty("--step", '0');
@@ -93,10 +93,10 @@ async function copyLink() {
}
}
console.log(currentArticle.value,'currentArtice')
</script>
<template>
<div id="breakcrumb" class="flex justify-between items-center my-3 font-arial">
<div id="breadcrumb" class="flex justify-between items-center my-3 font-arial">
<ul class="flex gap-6 items-center text-md">
<template v-for="(category, index) in currentCategoryTree" :key="index">
<li class="first:text-primary-600 hover:text-primary-600 font-medium relative after:absolute after:content-['\003E'] last:after:content-[''] after:right--4 after:text-gray-3">
components/dynamic-page/page-component/templates/articles/layouts/details/Image.vue
+4 -4
View File
@@ -41,9 +41,9 @@ onMounted(async () => {
clickElement("author", "author", "data-code");
let detailEmagazine = document.querySelector('div[layout="ARTICLE_DETAIL_EMAGAZINE"]');
let breakcrumb = document.querySelector('div[layout="BREADCRUM_DEFAULT"]');
if (detailEmagazine && breakcrumb) {
breakcrumb.classList.add("lg:max-w-640px", "mx-auto");
let breadcrumb = document.querySelector('div[layout="BREADCRUM_DEFAULT"]');
if (detailEmagazine && breadcrumb) {
breadcrumb.classList.add("lg:max-w-640px", "mx-auto");
}
});
@@ -80,7 +80,7 @@ async function copyLink() {
</script>
<template>
<div class="content" v-if="currentArticle">
<div id="breakcrumb" class="flex justify-between items-center my-3">
<div id="breadcrumb" class="flex justify-between items-center my-3">
<ul class="flex gap-6 items-center text-md">
<template v-for="(category, index) in currentCategoryTree" :key="index">
<li class="font-semibold relative after:absolute after:content-['\003E'] last:after:content-[''] after:right--4 after:text-gray-3">
components/dynamic-page/page-component/templates/articles/layouts/details/Podcast.vue
+5 -4
View File
@@ -41,9 +41,9 @@ onMounted(async () => {
clickElement("author", "author", "data-code");
let detailEmagazine = document.querySelector('div[layout="ARTICLE_DETAIL_EMAGAZINE"]');
let breakcrumb = document.querySelector('div[layout="BREADCRUM_DEFAULT"]');
if (detailEmagazine && breakcrumb) {
breakcrumb.classList.add("lg:max-w-640px", "mx-auto");
let breadcrumb = document.querySelector('div[layout="BREADCRUM_DEFAULT"]');
if (detailEmagazine && breadcrumb) {
breadcrumb.classList.add("lg:max-w-640px", "mx-auto");
}
});
@@ -115,6 +115,7 @@ const updateVolume = (num?: number) => {
if(num) {
volume.value += num
}
// console.log('1231321')
audioPlayer.value.volume = volume.value;
}
};
@@ -220,7 +221,7 @@ const durationComputed = computed(() => {
</div>
<div class="md:inline-flex hidden items-center gap-2 ml--10px h9 text-primary-600 rounded-8px text-28px cursor-pointer hover:bg-primary-100">
<Icon @click="updateVolume(-0.1)" name="material-symbols:volume-mute"></Icon>
<input v-if="isVolume" class="accent-primary-600 h-1 w-12 lg:w-20 cursor-pointer" type="range" v-model="volume" @input="updateVolume" min="0.1" max="1" step="0.1" />
<input v-if="isVolume" class="accent-primary-600 h-1 w-12 lg:w-20 cursor-pointer" type="range" v-model="volume" @input="updateVolume()" min="0.1" max="1" step="0.1" />
<Icon @click="updateVolume(0.1)" name="material-symbols:volume-up"></Icon>
</div>
</div>
components/dynamic-page/page-component/templates/collections/index.vue
+3 -1
View File
@@ -5,6 +5,7 @@ import {
const _props = defineProps<{
settings: any;
component?: any;
content?: any
}>();
const definedDynamicComponent: Record<string, any> = {
@@ -26,8 +27,9 @@ const GET_PROPS = computed(() => {
}
};
});
</script>
<template>
<component :is="definedDynamicComponent[getCurrentComponent]" v-bind="GET_PROPS()" />
<component :is="definedDynamicComponent[getCurrentComponent]" v-bind="{...GET_PROPS(), content: _props.content}" />
</template>
components/dynamic-page/page-component/templates/collections/layouts/Article.vue
+3 -1
View File
@@ -16,8 +16,8 @@ const _props = defineProps<{
dataQuery?: string;
layout?: string;
label?: string;
content?: any
}>();
const SETTING_OPTIONS = {
MAX_ELEMENT: 5,
TEMPLATE: "Article",
@@ -102,6 +102,8 @@ const mapActivesToItems = (index: number) => {
return output[index + 1] || {};
};
const CONTENT_PARSE = computed(() => JSON.parse(_props.content))
</script>
<template>
components/dynamic-page/page-component/templates/index.vue
+2 -1
View File
@@ -4,6 +4,7 @@ import { Dynamic_Section, Dynamic_Category, Dynamic_Collection, Dynamic_Navigati
const _props = defineProps<{
settings: any;
component?: any;
content?: any
}>();
const definedDynamicComponent: Record<string, any> = {
@@ -35,5 +36,5 @@ const GET_PROPS = computed(() => {
<template>
<!-- <component :is="definedDynamicComponent[getCurrentComponent]" v-bind="{ ...(GET_PROPS()), component: _props.component, settings: _props.settings }" /> -->
<component :is="definedDynamicComponent[getCurrentComponent]" v-bind="{ ...GET_PROPS(), component: _props.component, settings: _props.settings }" />
<component :is="definedDynamicComponent[getCurrentComponent]" v-bind="{ ...GET_PROPS(), component: _props.component, settings: _props.settings, content: _props.content }" />
</template>
components/dynamic-page/page-section/RecusiveSection.vue
+1
View File
@@ -43,6 +43,7 @@ const findDataPosition = computed(() => {
v-if="findDataPosition && findDataPosition?.id"
:settings="findDataPosition.settings"
:component="findDataPosition"
:content="findDataPosition.content"
/>
</template>
<template v-else-if="props.type === defineTypeRecusive.SECTION">