Cache panel contents after first load

Panels that do not have the preload attribute
have their contents destroyed and recreated on each reopen.

This causes issues such as inner text inputs and inner panels not
remembering their previous state,
and panels with src attribute repeating the same ajax request.

See
MarkBind/markbind#868
MarkBind/markbind#483

Let's have an additional `isCached` property, which is set to true
whenever the content is/will be loaded. Only when isCached is true
will the content be rendered and.

As a side effect, since once the panel is loaded v-show is always used,
the v-else part of the template is not needed anymore,
which also reduces code duplication.

src/Panel.vue

@@ -42,7 +42,7 @@
                     </slot>
                 </div>
             </div>
-            <template v-if="preloadBool">
+            <template v-if="preloadBool || isCached">
                 <div class="card-collapse"
                      ref="panel"
                      v-show="localExpanded"
@@ -57,21 +57,6 @@
                     <hr v-show="isSeamless" />
                 </div>
             </template>
-            <template v-else>
-                <div class="card-collapse"
-                     ref="panel"
-                     v-if="localExpanded"
-                >
-                    <div class="card-body">
-                        <slot></slot>
-                        <retriever v-if="hasSrc" ref="retriever" :src="src" :fragment="fragment" delay></retriever>
-                        <panel-switch v-show="isExpandableCard && bottomSwitchBool" :is-open="localExpanded"
-                                      @click.native.stop.prevent="collapseThenScrollIntoViewIfNeeded()"
-                                      @is-open-event="retrieveOnOpen"></panel-switch>
-                    </div>
-                    <hr v-show="isSeamless" />
-                </div>
-            </template>
         </div>
     </span>
 </template>
@@ -229,7 +214,8 @@
       return {
         onHeaderHover: false,
         localExpanded: false,
-        localMinimized: false
+        localMinimized: false,
+        isCached: false
       }
     },
     methods: {
@@ -270,6 +256,15 @@
     },
     watch: {
       'localExpanded': function (val, oldVal) {
+        if (this.isCached) {
+        	return;
+        }
+        /* When either one of the values is true,
+         * it means that the data is/will be cached.
+         */
+        if (val || oldVal) {
+          this.isCached = true;
+        }
         this.$nextTick(function () {
           this.retrieveOnOpen(this, val);
         })