Removes unused component (three-state-toggle-button).
This commit is contained in:
mateuswetah
parent
2e02cc616a
commit
6e5fd7d30c
|
|
@ -3,109 +3,88 @@
|
|||
<div class="table-wrapper">
|
||||
<table class="tainacan-table is-narrow">
|
||||
<thead>
|
||||
<tr>
|
||||
<!-- Title -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_activity_title') }}</div>
|
||||
</th>
|
||||
<!-- Created by -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_created_by') }}</div>
|
||||
</th>
|
||||
<!-- Activity date -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_activity_date') }}</div>
|
||||
</th>
|
||||
<!--<!– Approbation –>-->
|
||||
<!--<th>-->
|
||||
<!--<div class="th-wrap">{{ $i18n.get('label_approbation') }}</div>-->
|
||||
<!--</th>-->
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- Title -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_activity_title') }}</div>
|
||||
</th>
|
||||
<!-- Created by -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_created_by') }}</div>
|
||||
</th>
|
||||
<!-- Activity date -->
|
||||
<th>
|
||||
<div class="th-wrap">{{ $i18n.get('label_activity_date') }}</div>
|
||||
</th>
|
||||
<!--<!– Approbation –>-->
|
||||
<!--<th>-->
|
||||
<!--<div class="th-wrap">{{ $i18n.get('label_approbation') }}</div>-->
|
||||
<!--</th>-->
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
:key="index"
|
||||
v-for="(activity, index) of activities">
|
||||
<!-- Name -->
|
||||
<td
|
||||
class="column-default-width column-main-content"
|
||||
@click="openActivityDetailsModal(activity)"
|
||||
:label="$i18n.get('label_activity_title')"
|
||||
:aria-label="$i18n.get('label_activity_title') + ': ' + activity.title">
|
||||
<p
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: activity.title,
|
||||
autoHide: false,
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
|
||||
placement: 'auto-start'
|
||||
}">
|
||||
{{ activity.title }}
|
||||
</p>
|
||||
</td>
|
||||
<!-- User -->
|
||||
<td
|
||||
class="table-creation column-small-width"
|
||||
@click="openActivityDetailsModal(activity)"
|
||||
:label="$i18n.get('label_created_by')"
|
||||
:aria-label="$i18n.get('label_created_by') + ': ' + activity.user_name">
|
||||
<p
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: activity.user_name,
|
||||
autoHide: false,
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
|
||||
placement: 'auto-start'
|
||||
}"
|
||||
v-html="activity.user_name"/>
|
||||
</td>
|
||||
<!-- Activity Date -->
|
||||
<td
|
||||
class="table-creation column-small-width"
|
||||
@click="openActivityDetailsModal(activity)"
|
||||
:label="$i18n.get('label_activity_date')"
|
||||
:aria-label="$i18n.get('label_activity_date') + ': ' + activity.date">
|
||||
<p
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: activity.date,
|
||||
autoHide: false,
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
|
||||
placement: 'auto-start'
|
||||
}"
|
||||
v-html="activity.date"/>
|
||||
</td>
|
||||
<!-- Approbation -->
|
||||
<!--<td-->
|
||||
<!--class="status-cell"-->
|
||||
<!--:label="$i18n.get('label_approbation')"-->
|
||||
<!--:aria-label="$i18n.get('label_approbation') + ': ' + activity.status">-->
|
||||
<!--<p>-->
|
||||
<!--<three-state-toggle-button-->
|
||||
<!--:other-prop="activity"-->
|
||||
<!--:parent="getThis()"-->
|
||||
<!--:events="stateEvents"-->
|
||||
<!--:state=" activity.status === 'publish' ?-->
|
||||
<!--'yes_3tgbtn' : (activity.status === 'pending' ? 'neutral_3tgbtn' : 'no_3tgbtn')"/>-->
|
||||
|
||||
<!--<!–<a v-if="activity.status !== 'pending'">–>-->
|
||||
<!--<!–<b-icon–>-->
|
||||
<!--<!–type="is-blue5"–>-->
|
||||
<!--<!–custom-class="mdi-flip-h"–>-->
|
||||
<!--<!–icon="share"/>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--</p>-->
|
||||
<!--</td>-->
|
||||
</tr>
|
||||
<tr
|
||||
:key="index"
|
||||
v-for="(activity, index) of activities">
|
||||
<!-- Name -->
|
||||
<td
|
||||
class="column-default-width column-main-content"
|
||||
@click="openActivityDetailsModal(activity)"
|
||||
:label="$i18n.get('label_activity_title')"
|
||||
:aria-label="$i18n.get('label_activity_title') + ': ' + activity.title">
|
||||
<p
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: activity.title,
|
||||
autoHide: false,
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
|
||||
placement: 'auto-start'
|
||||
}">
|
||||
{{ activity.title }}
|
||||
</p>
|
||||
</td>
|
||||
<!-- User -->
|
||||
<td
|
||||
class="table-creation column-small-width"
|
||||
@click="openActivityDetailsModal(activity)"
|
||||
:label="$i18n.get('label_created_by')"
|
||||
:aria-label="$i18n.get('label_created_by') + ': ' + activity.user_name">
|
||||
<p
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: activity.user_name,
|
||||
autoHide: false,
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
|
||||
placement: 'auto-start'
|
||||
}"
|
||||
v-html="activity.user_name"/>
|
||||
</td>
|
||||
<!-- Activity Date -->
|
||||
<td
|
||||
class="table-creation column-small-width"
|
||||
@click="openActivityDetailsModal(activity)"
|
||||
:label="$i18n.get('label_activity_date')"
|
||||
:aria-label="$i18n.get('label_activity_date') + ': ' + activity.date">
|
||||
<p
|
||||
v-tooltip="{
|
||||
delay: {
|
||||
shown: 500,
|
||||
hide: 300,
|
||||
},
|
||||
content: activity.date,
|
||||
autoHide: false,
|
||||
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
|
||||
placement: 'auto-start'
|
||||
}"
|
||||
v-html="activity.date"/>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
|
@ -130,7 +109,6 @@
|
|||
import { mapActions } from 'vuex';
|
||||
|
||||
import ActivityDetailsModal from '../modals/activity-details-modal.vue';
|
||||
// import ThreeStateToggleButton from '../other/three-state-toggle-button.vue';
|
||||
|
||||
export default {
|
||||
name: 'ActivitiesList',
|
||||
|
|
|
|||
|
|
@ -1,117 +0,0 @@
|
|||
<template>
|
||||
<b-field>
|
||||
<div class="radio-wrapper">
|
||||
<b-radio-button
|
||||
v-model="state"
|
||||
:native-value="eventsName[1]"
|
||||
type="is-danger">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="close"/>
|
||||
</b-radio-button>
|
||||
|
||||
<b-radio-button
|
||||
v-model="state"
|
||||
:native-value="eventsName[2]">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="exclamation"/>
|
||||
</b-radio-button>
|
||||
|
||||
<b-radio-button
|
||||
v-model="state"
|
||||
:native-value="eventsName[0]"
|
||||
type="is-success">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="check"/>
|
||||
</b-radio-button>
|
||||
</div>
|
||||
</b-field>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "ThreeStateToggleButton",
|
||||
props: {
|
||||
parent: {
|
||||
type: Object,
|
||||
default: new Object({})
|
||||
},
|
||||
events: {
|
||||
type: Object,
|
||||
default: new Object({})
|
||||
},
|
||||
otherProp: {
|
||||
type: Object,
|
||||
default: new Object({})
|
||||
},
|
||||
state: {
|
||||
type: String,
|
||||
default: 'neutral_3tgbtn'
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
eventsName: ['yes_3tgbtn', 'no_3tgbtn', 'neutral_3tgbtn'],
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
state(functionName) {
|
||||
this[`${functionName}`]();
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (Object.keys(this.events).length && !Object.keys(this.parent._events).length) {
|
||||
for (let [event, callback] of Object.entries(this.events)) {
|
||||
if (this.eventsName.includes(event)) {
|
||||
this.parent.$on(event, callback);
|
||||
} else {
|
||||
this.$console.error(
|
||||
`Invalid event name, the event [${event} | ${callback}] not in events list [${this.eventsName.toString()}]`
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
yes_3tgbtn() {
|
||||
this.parent.$emit(this.eventsName[0], this.otherProp);
|
||||
},
|
||||
no_3tgbtn() {
|
||||
this.parent.$emit(this.eventsName[1], this.otherProp);
|
||||
},
|
||||
neutral_3tgbtn() {
|
||||
this.parent.$emit(this.eventsName[2], this.otherProp);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.radio-wrapper {
|
||||
display: flex;
|
||||
border: solid 0.5px lightgray;
|
||||
border-radius: 50px;
|
||||
height: 20.49px;
|
||||
width: 57.5px;
|
||||
justify-content: center;
|
||||
|
||||
label.is-small {
|
||||
height: 18px !important;
|
||||
border: none;
|
||||
border-radius: 50px !important;
|
||||
width: 18px;
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.wp-core-ui p .button {
|
||||
vertical-align: top !important;
|
||||
}
|
||||
|
||||
.button .icon:first-child:not(:last-child) {
|
||||
margin-left: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue