All files / ext.wikilambda.edit/components/function ZTesterList.vue

57.14% Statements 8/14
100% Branches 0/0
0% Functions 0/3
57.14% Lines 8/14

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99                                                                                          18x 18x 18x 18x 18x 18x 18x     18x                                                                                        
<template>
	<!--
		WikiLambda Vue component for ZLists of ZTester objects.
 
		@copyright 2020– Abstract Wikipedia team; see AUTHORS.txt
		@license MIT
	-->
	<div>
		<h3>{{ $i18n( 'wikilambda-editor-tester-list-label' ).text() }}</h3>
		<ul class="ext-wikilambda-zlist-no-bullets">
			<wl-z-tester-list-item
				v-for="( item ) in ZlistItems"
				:key="item.id"
				:zobject-id="item.id"
				:viewmode="getViewMode"
				:z-type="Constants.Z_TESTER"
				@remove-item="removeItem"
			></wl-z-tester-list-item>
			<li v-if="!getViewMode">
				<cdx-button
					:title="tooltipAddListItem"
					@click="addNewItem"
				>
					{{ $i18n( 'wikilambda-editor-additem' ).text() }}
				</cdx-button>
			</li>
		</ul>
		<div v-if="getViewMode && ZlistItems.length <= 0">
			{{ $i18n( 'wikilambda-tester-none-found' ).text() }}
		</div>
		<wl-z-tester-ad-hoc
			v-if="getNewTesterId"
			:zobject-id="getNewTesterId"
			:z-tester-list-id="zobjectId"
		></wl-z-tester-ad-hoc>
		<cdx-button v-if="!getViewMode && !getNewTesterId" @click="createNewTester">
			{{ $i18n( 'wikilambda-tester-create-new' ).text() }}
		</cdx-button>
		<a v-if="getViewMode" :href="createNewTesterLink">
			{{ $i18n( 'wikilambda-tester-create-new' ).text() }}
		</a>
	</div>
</template>
 
<script>
var Constants = require( '../../Constants.js' ),
	mapActions = require( 'vuex' ).mapActions,
	mapGetters = require( 'vuex' ).mapGetters,
	CdxButton = require( '@wikimedia/codex' ).CdxButton,
	ZTesterListItem = require( './ZTesterListItem.vue' ),
	ZTesterAdHoc = require( './ZTesterAdHoc.vue' ),
	ZTypedList = require( '../main-types/ZTypedList.vue' );
 
// @vue/component
module.exports = exports = {
	name: 'wl-z-tester-list',
	components: {
		'wl-z-tester-list-item': ZTesterListItem,
		'wl-z-tester-ad-hoc': ZTesterAdHoc,
		'cdx-button': CdxButton
	},
	extends: ZTypedList,
	computed: $.extend( mapGetters( [
		'getNextObjectId',
		'getNewTesterId',
		'getViewMode'
	] ),
	{
		Constants: function () {
			return Constants;
		},
		createNewTesterLink: function () {
			return new mw.Title( 'Special:CreateZObject' ).getUrl() + `?zid=${Constants.Z_TESTER}`;
		}
	}
	),
	methods: $.extend( mapActions( [
		'addZReference',
		'createNewTester'
	] ), {
		addNewItem: function ( /* event */ ) {
			var nextId = this.getNextObjectId,
				payload = {
					// since first item is type, new key is items length + 1
					key: `${this.ZlistItemsLength + 1}`,
					value: 'object',
					parent: this.zobjectId
				};
			this.addZObject( payload );
 
			this.addZReference( {
				value: '',
				id: nextId
			} );
		}
	} )
};
</script>