chore: add toggle bool for features and tools
This commit is contained in:
parent
0575cd3ac5
commit
248b566f91
@ -200,7 +200,7 @@
|
||||
</main>
|
||||
<div
|
||||
v-if="show_content && cvdata.core && cvdata.core.name"
|
||||
class="mr-auto w-full lg:w-1/2 text-center text-sm py-2 pr-5 text-gray-600 border-gray-300 border-1 border-b-0 rounded-t-lg"
|
||||
class="noprint mr-auto w-full lg:w-1/2 text-center text-sm py-2 pr-5 text-gray-600 border-gray-300 border-1 border-b-0 rounded-t-lg"
|
||||
>
|
||||
<nav-menu
|
||||
:position="NavPosition.footer"
|
||||
|
@ -17,6 +17,7 @@
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="project-name" v-html="item.name"></div>
|
||||
<div v-if="item.auth.show" :id="`project-${index}`">
|
||||
<div v-for="(info,key,infoindex) in showinfo" :key="infoindex">
|
||||
<section
|
||||
@ -24,7 +25,7 @@
|
||||
:class="key === 'purpose' ? 'mt-2' : 'mb-0'"
|
||||
>
|
||||
<div class="left-item">
|
||||
<div v-if="key === 'name'" class="project-name text-center">
|
||||
<div v-if="key === 'name'" class="text-center">
|
||||
<tiptap-editor
|
||||
v-if="authinfo.editable"
|
||||
:data="item.name"
|
||||
@ -34,7 +35,6 @@
|
||||
:idx="index"
|
||||
@onEditorBlur="onEditor"
|
||||
/>
|
||||
<div v-else v-html="item.name"></div>
|
||||
</div>
|
||||
<span v-else class="text-gray-400 dark:text-gray-500">{{ t(key).toLocaleLowerCase() }}</span>
|
||||
</div>
|
||||
@ -87,9 +87,17 @@
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
<section v-if="key === 'features' && item.features && Object.keys(item.features).length > 0">
|
||||
<section v-if="key === 'features' && item.features && Object.keys(item.features).length > 0"
|
||||
:class="authinfo.toggle ? 'mt-2' : ''"
|
||||
>
|
||||
<div class="left-item">
|
||||
<span class="text-gray-400 dark:text-gray-500">{{ t(key, key).toLocaleLowerCase() }}</span>
|
||||
<span
|
||||
:class="authinfo.toggle ? 'btn-toggle noprint text-gray-400 dark:text-gray-500' : 'text-gray-400 dark:text-gray-500'"
|
||||
:data="`project-${index}-${key}`"
|
||||
@click="onClick"
|
||||
>
|
||||
{{ t(key, key).toLocaleLowerCase() }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="right-item features">
|
||||
<tiptap-editor
|
||||
@ -102,14 +110,23 @@
|
||||
:idx="index"
|
||||
@onEditorBlur="onEditor"
|
||||
/>
|
||||
<span v-else v-html="`<li>${item[key].join('</li><li>')}</li>`" />
|
||||
<span v-else >
|
||||
<span
|
||||
:id="`project-${index}-${key}`"
|
||||
:class="authinfo.toggle ? 'hidden' : ''"
|
||||
v-html="`<li>${item[key].join('</li><li>')}</li>`" />
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
<section v-if="key === 'builtwith' && item.builtwith && Object.keys(item.builtwith).length > 0">
|
||||
<section v-if="key === 'builtwith' && item.builtwith && Object.keys(item.builtwith).length > 0"
|
||||
:class="authinfo.toggle ? 'mt-2' : ''"
|
||||
>
|
||||
<span
|
||||
class="text-gray-400 dark:text-gray-500"
|
||||
:class="authinfo.toggle ? 'btn-toggle noprint text-gray-400 dark:text-gray-500' : 'text-gray-400 dark:text-gray-500'"
|
||||
:data="`project-${index}-${key}`"
|
||||
@click="onClick"
|
||||
>{{ t('builtwith', 'Builtwith').toLocaleLowerCase() }}</span>
|
||||
<div class="tag-list my-3">
|
||||
<div class="my-3">
|
||||
<tiptap-editor
|
||||
v-if="authinfo.editable"
|
||||
:data="`<b>${item[key].join('</b> <b>')}</b> `"
|
||||
@ -120,7 +137,10 @@
|
||||
:htmlattrs="{ ...useState().htmlAttrs, bold: 'tag-item font-light mb-2' }"
|
||||
@onEditorBlur="onEditor"
|
||||
/>
|
||||
<div v-else>
|
||||
<div v-else
|
||||
:id="`project-${index}-${key}`"
|
||||
:class="authinfo.toggle ? 'tag-list noprint hidden' : 'tag-list '"
|
||||
>
|
||||
<span
|
||||
v-for="(built ,builtindex) in item[key]"
|
||||
:key="builtindex"
|
||||
@ -212,5 +232,13 @@ const onItem = (idx: number) => {
|
||||
const onLink = (e: any) => {
|
||||
track_action(e,{ ref: 'projects',text: e.target.href || '', lng: i18n.locale.value },routeKy.toString())
|
||||
}
|
||||
|
||||
const onClick = (e: any) => {
|
||||
let target: string = e.target.getAttribute('data')
|
||||
if (target) {
|
||||
let elem = document.getElementById(target)
|
||||
if (elem) {
|
||||
elem.classList.toggle('hidden');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
@ -24,6 +24,12 @@
|
||||
class="mb-0"
|
||||
>
|
||||
<div class="left-item">
|
||||
<span
|
||||
class="text-gray-400 dark:text-gray-500"
|
||||
v-if="key !== 'where' && key !== 'wheredef'"
|
||||
>{{ t(key).toLocaleLowerCase() }}</span>
|
||||
</div>
|
||||
<div class="right-item">
|
||||
<h3 v-if="key === 'where'">
|
||||
<tiptap-editor
|
||||
v-if="authinfo.editable"
|
||||
@ -35,14 +41,7 @@
|
||||
@onEditorBlur="onEditor"
|
||||
/>
|
||||
<span v-else v-html="item.where"></span>
|
||||
</h3>
|
||||
<span
|
||||
class="text-gray-400 dark:text-gray-500"
|
||||
v-if="key !== 'where' && key !== 'wheredef'"
|
||||
>{{ t(key).toLocaleLowerCase() }}</span>
|
||||
</div>
|
||||
<div class="right-item">
|
||||
<span v-if="key === 'where'">
|
||||
<span class="pr-2">: </span>
|
||||
<tiptap-editor
|
||||
v-if="authinfo.editable"
|
||||
:data="item.wheredef"
|
||||
@ -53,7 +52,7 @@
|
||||
@onEditorBlur="onEditor"
|
||||
/>
|
||||
<span v-else>{{ item.wheredef }}</span>
|
||||
</span>
|
||||
</h3>
|
||||
<span v-if="key !== 'wheredef' && key !== 'where'">
|
||||
<tiptap-editor
|
||||
v-if="authinfo.editable"
|
||||
@ -114,9 +113,17 @@
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section v-if="key === 'tools' && item.tools && Object.keys(item.tools).length > 0" class>
|
||||
<span class="text-gray-400 dark:text-gray-500">{{ t('tools', 'Tools').toLocaleLowerCase() }}</span>
|
||||
<div class="tag-list my-3">
|
||||
<section v-if="key === 'tools' && item.tools && Object.keys(item.tools).length > 0"
|
||||
:class="authinfo.toggle ? 'mt-2' : ''"
|
||||
>
|
||||
<span
|
||||
:class="authinfo.toggle ? 'btn-toggle noprint text-gray-400 dark:text-gray-500' : 'text-gray-400 dark:text-gray-500'"
|
||||
:data="`workexperience-${index}-${key}`"
|
||||
@click="onClick"
|
||||
>
|
||||
{{ t('tools', 'Tools').toLocaleLowerCase() }}
|
||||
</span>
|
||||
<div class="my-3">
|
||||
<tiptap-editor
|
||||
v-if="authinfo.editable"
|
||||
:data="`<b>${item[key].join('</b> <b>')}</b> `"
|
||||
@ -127,12 +134,16 @@
|
||||
:htmlattrs="{ ...useState().htmlAttrs, bold: 'tag-item font-light mb-2 leading-loose' }"
|
||||
@onEditorBlur="onEditor"
|
||||
/>
|
||||
<span
|
||||
v-else
|
||||
v-for="tool,toolindex in item[key]"
|
||||
:key="toolindex"
|
||||
class="tag-item font-light mb-2"
|
||||
>{{ tool }}</span>
|
||||
<div v-else
|
||||
:id="`workexperience-${index}-${key}`"
|
||||
:class="authinfo.toggle ? 'hidden noprint tag-list' : 'tag-list'"
|
||||
>
|
||||
<span
|
||||
v-for="tool,toolindex in item[key]"
|
||||
:key="toolindex"
|
||||
class="tag-item font-light mb-2"
|
||||
>{{ tool }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
@ -197,6 +208,15 @@ const onEditor = (info: { src: string, field: string, idx: number, data: string,
|
||||
const onItem = (idx: number) => {
|
||||
emit('onItem', { src: 'work_experience', itm: props.data[idx], idx })
|
||||
}
|
||||
const onClick = (e: any) => {
|
||||
let target: string = e.target.getAttribute('data')
|
||||
if (target) {
|
||||
let elem = document.getElementById(target)
|
||||
if (elem) {
|
||||
elem.classList.toggle('hidden');
|
||||
}
|
||||
}
|
||||
}
|
||||
// const onItem = (e: any) => {
|
||||
// const el = e.target && e.target.closest ? e.target.closest('.experience-item') : null
|
||||
// if (el) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user