Covivo/mobicoop

View on GitHub
client/src/MobicoopBundle/Resources/assets/js/components/utilities/ToolBox/ToolBoxItem.vue

Summary

Maintainability
Test Coverage
<template>
  <v-card flat>
    <div class="d-flex flex-no-wrap justify-space-between">
      <div>
        <v-row align="center">
          <v-col
            cols="6"
            md="8"
            lg="6"
            class="text-left"
          >
            <v-avatar
              class="ma-0"
              size="125"
              tile
            >
              <a
                :href="downloadLink"
                :title="textDownload"
              >
                <v-img
                  :src="image"
                  contain
                  max-width="90"
                />
              </a>
            </v-avatar>
          </v-col>
          <v-col
            cols="6"
            class="text-left"
          >
            <h4
              class="primary--text text-left font-weight-bold"
            >
              {{ title }}
            </h4>
            <a
              class="primary--text body-2"
              style="text-decoration:none; background-color: #ffff66;"
              :href="linkSubtitle"
              target="_blank"
            >
              {{ subtitle }}
            </a>
            <div v-if="textDownload">
              <a
                style="text-decoration:none;"
                class="primary--text body-2"
                :href="downloadLink"
                :title="textDownload"
                download
                target="_blank"
              >
                {{ textDownload }}
              </a>
              <br>
            </div>
            <div v-if="personalizedText">
              <a
                :href="personalizedTextLink"
                :title="personalizedText"
                style="text-decoration:none;"
                class="accent--text body-2"
                download
              >
                {{ personalizedText }}</a>
              <br>
            </div>
            <a
              :href="link1"
              :title="textLogo1"
              style="text-decoration:none;"
              class="accent--text body-2"
            >{{ textLogo1 }}</a>
            <a
              :href="link2"
              :title="textLogo2"
              style="text-decoration:none;"
              class="accent--text body-2"
            >{{ textLogo2 }}</a>
            <a
              :href="link3"
              :title="textLogo3"
              style="text-decoration:none;"
              class="accent--text body-2"
            >{{ textLogo3 }}</a>
          </v-col>
        </v-row>
      </div>
    </div>
  </v-card>
</template>

<script>
export default {
  props: {
    image:{
      type: String,
      default: null
    },
    textDownload:{
      type: String,
      default: null
    },
    downloadLink:{
      type: String,
      default: null
    },
    personalizedText:{
      type: String,
      default: null
    },
    personalizedTextLink:{
      type: String,
      default: null
    },
    link1:{
      type: String,
      default: null
    },
    link2:{
      type: String,
      default: null
    },
    link3:{
      type: String,
      default: null
    },
    textLogo1:{
      type: String,
      default: null
    },
    textLogo2:{
      type: String,
      default: null
    },
    textLogo3:{
      type: String,
      default: null
    },
    title:{
      type: String,
      default: null
    },
    subtitle:{
      type: String,
      default: null
    },
    linkSubtitle:{
      type: String,
      default: null
    }
  },
  data() {
    return {
    }
  },
  mounted() {
    console.log(this.title, this.textDownload);
  }
};
</script>