Item details & Items list: Add Copy DSL Definition button (#3084)

Add Copy DSL Definition for items, both in Item Details and Items List
using the definition provided by
openhab/openhab-core#4569.

Resolves openhab/openhab-core#4509.

---------

Signed-off-by: Jimmy Tanagra <[email protected]>

Author: jimtng

bundles/org.openhab.ui/web/src/pages/settings/items/item-details.vue

@@ -90,6 +90,9 @@
             <f7-list-button color="blue" @click="duplicateItem">
               Duplicate Item
             </f7-list-button>
+            <f7-list-button color="blue" @click="copyItemDslDefinition">
+              Copy DSL Definition
+            </f7-list-button>
             <f7-list-button v-if="item.editable" color="red" @click="deleteItem">
               Remove Item
             </f7-list-button>
@@ -217,6 +220,20 @@ export default {
         }
       })
     },
+    copyItemDslDefinition () {
+      this.$oh.api.getPlain({
+        url: '/rest/file-format/items/' + this.item.name,
+        headers: { accept: 'text/vnd.openhab.dsl.item' }
+      }).then(definition => {
+        if (this.$clipboard(definition)) {
+          this.$f7.toast.create({
+            text: `DSL Item definition for '${this.item.name}' copied to clipboard`,
+            destroyOnClose: true,
+            closeTimeout: 2000
+          }).open()
+        }
+      })
+    },
     deleteItem () {
       this.$f7.dialog.confirm(
         `Are you sure you want to delete ${this.item.label || this.item.name}?`,

bundles/org.openhab.ui/web/src/pages/settings/items/items-list-vlist.vue

@@ -18,15 +18,19 @@
       </f7-subnavbar>
     </f7-navbar>
     <f7-toolbar class="contextual-toolbar" :class="{ 'navbar': $theme.md }" v-if="showCheckboxes" bottom-ios bottom-aurora>
-      <f7-link color="red" v-show="selectedItems.length" v-if="!$theme.md" class="delete" icon-ios="f7:trash" icon-aurora="f7:trash" @click="removeSelected">
+      <f7-link color="red" v-show="selectedItems.length" v-if="!$theme.md" class="delete right-margin" icon-ios="f7:trash" icon-aurora="f7:trash" @click="removeSelected">
         Remove {{ selectedItems.length }}
       </f7-link>
+      <f7-link color="blue" v-show="selectedItems.length" v-if="!$theme.md" class="copy" icon-ios="f7:square_on_square" icon-aurora="f7:square_on_square" @click="copySelected">
+        &nbsp;Copy DSL Definitions
+      </f7-link>
       <f7-link v-if="$theme.md" icon-md="material:close" icon-color="white" @click="showCheckboxes = false" />
       <div class="title" v-if="$theme.md">
         {{ selectedItems.length }} selected
       </div>
-      <div class="right" v-if="$theme.md">
-        <f7-link v-show="selectedItems.length" icon-md="material:delete" icon-color="white" @click="removeSelected" />
+      <div class="right" v-if="$theme.md && selectedItems.length">
+        <f7-link icon-md="material:delete" icon-color="white" @click="removeSelected" />
+        <f7-link icon-md="material:content_copy" icon-color="white" @click="copySelected" />
       </div>
     </f7-toolbar>
 
@@ -135,6 +139,11 @@
 </style>
 
 <script>
+import Vue from 'vue'
+import Clipboard from 'v-clipboard'
+
+Vue.use(Clipboard)
+
 import ItemMixin from '@/components/item/item-mixin'
 
 export default {
@@ -273,6 +282,21 @@ export default {
         this.selectedItems.push(item)
       }
     },
+    copySelected () {
+      const promises = this.selectedItems.map((itemName) => this.$oh.api.getPlain({
+        url: '/rest/file-format/items/' + itemName,
+        headers: { accept: 'text/vnd.openhab.dsl.item' }
+      }))
+      Promise.all(promises).then((data) => {
+        if (this.$clipboard(data.join('\n'))) {
+          this.$f7.toast.create({
+            text: 'DSL definitions copied to clipboard',
+            destroyOnClose: true,
+            closeTimeout: 2000
+          }).open()
+        }
+      })
+    },
     removeSelected () {
       const vm = this
 

bundles/org.openhab.ui/web/src/pages/settings/things/thing-details.vue

@@ -139,7 +139,7 @@
               <f7-list-button v-if="thing.statusInfo.statusDetail === 'HANDLER_MISSING_ERROR'" color="blue" title="Install Binding" @click="installBinding" />
               <f7-list-button v-if="!error" color="blue" title="Duplicate Thing" @click="duplicateThing" />
               <f7-list-button v-if="!error" color="blue" title="Copy DSL Definition" @click="copyThingDsl" />
-              <f7-list-button v-if="editable" color="red" title="Remove Thing" @click="deleteThing"/>
+              <f7-list-button v-if="editable" color="red" title="Remove Thing" @click="deleteThing" />
             </f7-list>
           </f7-col>
         </f7-block>