From 5dcda0e0a084861b59eee583cbe45bfb0293797e Mon Sep 17 00:00:00 2001
From: sadnub <josh@torchlake.com>
Date: Sat, 13 Nov 2021 13:39:38 -0500
Subject: [PATCH] allow q-select slots in tactical-dropdown. Fix info icon on
 run script dialog

---
 .../components/modals/agents/RunScript.vue    | 24 ++++++++++---------
 web/src/components/ui/TacticalDropdown.vue    |  8 ++++++-
 2 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/web/src/components/modals/agents/RunScript.vue b/web/src/components/modals/agents/RunScript.vue
index d18e52f3..eab516fe 100644
--- a/web/src/components/modals/agents/RunScript.vue
+++ b/web/src/components/modals/agents/RunScript.vue
@@ -15,9 +15,8 @@
         </q-btn>
       </q-bar>
       <q-form @submit.prevent="sendScript">
-        <q-card-section class="row">
+        <q-card-section>
           <tactical-dropdown
-            class="col-11"
             :rules="[val => !!val || '*Required']"
             v-model="state.script"
             :options="scriptOptions"
@@ -25,14 +24,13 @@
             outlined
             mapOptions
             filterable
-          />
-          <q-btn class="col-1" size="sm" round dense flat icon="info" @click="link ? OpenURL(link) : null">
-            <q-tooltip
-              v-if="syntax"
-              class="bg-white text-primary text-body1"
-              v-html="formatScriptSyntax(syntax)"
-            ></q-tooltip>
-          </q-btn>
+          >
+            <template v-slot:after>
+              <q-btn size="sm" round dense flat icon="info" @click="openScriptURL">
+                <q-tooltip v-if="syntax" class="bg-white text-primary text-body1" v-html="formatScriptSyntax(syntax)" />
+              </q-btn>
+            </template>
+          </tactical-dropdown>
         </q-card-section>
         <q-card-section>
           <tactical-dropdown
@@ -169,6 +167,10 @@ export default {
       }
     }
 
+    function openScriptURL() {
+      link.value ? openURL(link.value) : null;
+    }
+
     // watchers
     watch([() => state.value.output, () => state.value.emailMode], () => (state.value.emails = []));
 
@@ -189,7 +191,7 @@ export default {
       //methods
       formatScriptSyntax,
       sendScript,
-      openURL,
+      openScriptURL,
 
       // quasar dialog plugin
       dialogRef,
diff --git a/web/src/components/ui/TacticalDropdown.vue b/web/src/components/ui/TacticalDropdown.vue
index 3f51f8de..60c97ca4 100644
--- a/web/src/components/ui/TacticalDropdown.vue
+++ b/web/src/components/ui/TacticalDropdown.vue
@@ -11,7 +11,12 @@
     :use-chips="multiple"
     :use-input="filterable"
     @[filterEvent]="filterFn"
+    v-bind="$attrs"
   >
+    <template v-for="(_, slot) in $slots" v-slot:[slot]="scope">
+      <slot :name="slot" v-bind="scope || {}" />
+    </template>
+
     <template v-slot:option="scope">
       <q-item
         v-if="!scope.opt.category"
@@ -22,7 +27,7 @@
         <q-item-section>
           <q-item-label v-html="mapOptions ? scope.opt.label : scope.opt"></q-item-label>
         </q-item-section>
-        <q-item-section v-if="filtered && mapOptions" side>{{ scope.opt.cat }}</q-item-section>
+        <q-item-section v-if="filtered && mapOptions && scope.opt.cat" side>{{ scope.opt.cat }}</q-item-section>
       </q-item>
       <q-item-label v-if="scope.opt.category" header class="q-pa-sm" :key="scope.opt.category">{{
         scope.opt.category
@@ -36,6 +41,7 @@ import { ref, computed } from "vue";
 
 export default {
   name: "tactical-dropdown",
+  inheritAttrs: false,
   props: {
     modelValue: !String,
     mapOptions: {