forked from geolba/tethys.frontend
- added DataMetricsBadge.vue component for showing metrics downloads, views and citations
- npm updates - new major version typescript 5
This commit is contained in:
Arno Kaimbacher
parent
f1fbc2d917
commit
cfc81f2d90
1227
package-lock.json
generated
1227
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
|
|
@ -42,7 +42,7 @@
|
|||
"prettier": "^2.7.1",
|
||||
"sass": "^1.26.5",
|
||||
"sass-loader": "^13.0.0",
|
||||
"typescript": "^4.8.4",
|
||||
"typescript": "^5.1.3",
|
||||
"webpack": "^5.72.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
7
src/assets/datacite/citationIcon.vue
Normal file
7
src/assets/datacite/citationIcon.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
||||
<path
|
||||
d="M464 32H336c-26.5 0-48 21.5-48 48v128c0 26.5 21.5 48 48 48h80v64c0 35.3-28.7 64-64 64h-8c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24h8c88.4 0 160-71.6 160-160V80c0-26.5-21.5-48-48-48zm-288 0H48C21.5 32 0 53.5 0 80v128c0 26.5 21.5 48 48 48h80v64c0 35.3-28.7 64-64 64h-8c-13.3 0-24 10.7-24 24v48c0 13.3 10.7 24 24 24h8c88.4 0 160-71.6 160-160V80c0-26.5-21.5-48-48-48z"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
7
src/assets/datacite/downloadIcon.vue
Normal file
7
src/assets/datacite/downloadIcon.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
|
||||
<path
|
||||
d="M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
17
src/assets/datacite/infoCircleIcon.vue
Normal file
17
src/assets/datacite/infoCircleIcon.vue
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
<template>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
focusable="false"
|
||||
data-prefix="fas"
|
||||
data-icon="info-circle"
|
||||
class="svg-inline--fa fa-info-circle fa-w-16"
|
||||
role="img"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 512 512"
|
||||
>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z"
|
||||
></path>
|
||||
</svg>
|
||||
</template>
|
||||
36
src/assets/datacite/mediumBadge.vue
Normal file
36
src/assets/datacite/mediumBadge.vue
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
<template>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
version="1.1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 420 525"
|
||||
style="enable-background: new 0 0 420 420"
|
||||
xml:space="preserve"
|
||||
>
|
||||
<g>
|
||||
<path
|
||||
fill="navy"
|
||||
d="M210,420c115.98,0,210-94.02,210-210S325.98,0,210,0S0,94.02,0,210S94.02,420,210,420z M102.75,356.083 c4.694,0,8.5,3.806,8.5,8.5c0,4.694-3.806,8.5-8.5,8.5c-4.694,0-8.5-3.806-8.5-8.5C94.25,359.888,98.055,356.083,102.75,356.083z M126.417,387.083c-4.694,0-8.5-3.806-8.5-8.5c0-4.694,3.806-8.5,8.5-8.5s8.5,3.806,8.5,8.5 C134.917,383.277,131.111,387.083,126.417,387.083z M386.89,270.021c-4-0.844-8.532,2.038-13.756,8.727l-2.027-1.108 c1-7.57,3.666-13.371,7.993-17.3c5.727-5.199,13.053-5.803,16.877-5.708c-1.447,6.029-3.178,11.948-5.182,17.742 C389.733,271.223,388.447,270.346,386.89,270.021z M375.09,279.817c5.491-6.923,9.126-8.101,11.348-7.644 c1.397,0.291,2.552,1.312,3.494,2.642c-1.317,3.646-2.745,7.239-4.274,10.779L375.09,279.817z M343.703,113.234l2.954,4.862 l-4.862,2.954l-2.954-4.862L343.703,113.234z M330.318,114.278l-1.787-2.942l31.621-19.213l1.787,2.942L330.318,114.278z M348.767,121.569l2.954,4.862l-4.862,2.954l-2.954-4.862L348.767,121.569z M349.653,116.276l-2.954-4.862l4.862-2.954l2.954,4.862 L349.653,116.276z M356.625,116.795l2.954,4.862l-4.862,2.954l-2.954-4.862L356.625,116.795z M357.796,111.276l-2.954-4.862 l4.862-2.954l2.954,4.862L357.796,111.276z M364.768,111.795l2.954,4.862l-4.862,2.954l-2.954-4.862L364.768,111.795z M245.027,44.365V21.979c6.073,1.129,12.047,2.541,17.906,4.231v18.155H245.027z M222.974,44.365V19.202 c6.05,0.407,12.022,1.097,17.906,2.056v23.107H222.974z M218.828,18.964v25.401h-17.906V18.973 c3.009-0.141,6.034-0.221,9.078-0.221C212.959,18.752,215.901,18.83,218.828,18.964z M156.817,44.365V26.284 c5.858-1.699,11.833-3.12,17.906-4.258v22.338H156.817z M178.869,21.3c5.884-0.967,11.856-1.667,17.906-2.082v25.147h-17.906V21.3z M152.67,27.534v16.831h-26.337v4.146h167.083v-4.146h-26.337V27.453c34.488,10.807,64.8,31.139,87.848,57.899l-34.941,21.23 l30.117,49.568l23.498-14.277l13.388,26.034l8.535-4.389c3.731,14.887,5.724,30.456,5.724,46.483 c0,14.579-1.647,28.78-4.752,42.433c-4.033-0.185-12.269,0.297-18.856,6.262c-4.569,4.138-7.433,10.113-8.592,17.82l-4.236-2.315 l-24.94,45.629l11.588,6.334l-65.348,53.229l3.607,4.428c-12.342,5.683-25.388,10.085-38.969,13.044v-10.113h-62.667v13.235 c-14.036-1.609-27.615-4.739-40.566-9.229l8.453-12.694l-64.09-42.679l-10.609,15.932C55.395,327.723,36,297.139,26.105,262.583 H40.75v-10.306c15.005-13.643,21.584-26.699,19.55-38.855c-1.987-11.872-11.675-20.244-19.55-25.218v-7.287h5.333v-2.575 c6.492-1.971,11.962-7.543,12.402-13.187c0.252-3.229-0.944-9.076-11.786-11.967c-6.358-1.695-11.009-1.125-13.822,1.7 c-2.173,2.182-2.807,5.292-2.865,8.03h-5.39C40.947,98.677,89.868,47.31,152.67,27.534z M40.75,169.916v-7h-8.543 c0.049-2.283,0.557-4.797,2.23-6.478c2.216-2.225,6.15-2.605,11.696-1.126c6.894,1.838,10.502,5.272,10.159,9.67 c-0.354,4.536-4.863,9.169-10.209,11.043v-6.109H40.75z M35.75,169.249v4.667H22.417v-4.667H35.75z M22.417,183.249v-4.667H35.75 v4.667H22.417z M40.75,242.469c7.072-6.671,10.424-13.292,9.945-19.768c-0.532-7.187-5.618-12.565-9.945-15.887V190.9 c7.273,4.843,15.648,12.517,17.381,22.892c1.833,10.974-4.025,22.888-17.381,35.477V242.469z M40.75,224.916v-15.233 c3.619,3.087,7.34,7.576,7.752,13.189c0.392,5.336-2.222,10.868-7.752,16.53v-4.82H20.327c-0.412-3.198-0.746-6.421-0.997-9.667 H40.75z"
|
||||
/>
|
||||
<path
|
||||
d="M247.773,292.246c-11.503,5.304-24.298,8.269-37.773,8.269c-49.91,0-90.515-40.605-90.515-90.515 c0-49.91,40.605-90.515,90.515-90.515c49.699,0,90.165,40.263,90.507,89.883c1.634,0.243,3.22,0.635,4.734,1.176 c0.001-0.182,0.007-0.362,0.007-0.544c0-52.604-42.644-95.248-95.248-95.248c-52.604,0-95.248,42.644-95.248,95.248 c0,17.255,4.588,33.438,12.611,47.396l-61.7,38.931l5.692,9.021l61.839-39.019c17.336,23.598,45.28,38.918,76.806,38.918 c14.337,0,27.931-3.174,40.127-8.848L247.773,292.246z"
|
||||
/>
|
||||
<ellipse transform="matrix(0.5109 -0.8597 0.8597 0.5109 -12.1749 390.1086)" cx="336.721" cy="205.753" rx="22.5" ry="22.5" />
|
||||
<path
|
||||
d="M236.061,360.269l52.989-27.836c2.995-1.574,5.226-4.295,6.18-7.542s0.551-6.742-1.117-9.687l-17.798-31.413 c3.899-8.552,9.898-16.735,16.041-24.091c-7.731-14.904-7.732-27.708-7.719-28.688c0.073-5.55,4.647-10.065,10.197-10.065 l0.137,0.001c5.594,0.074,10.108,4.684,10.065,10.277c0.001,0.481,0.078,5.198,2.267,11.701c6.865-7.181,9.261-18.593,3.267-24.528 c-6.251-6.191-19.259-8.527-31.067,1.488c-16.156,13.866-24.122,24.407-33.247,44.826c-2.917,8.139-1.894,13.947,0.887,18.292 c0.018,0.032,0.031,0.066,0.049,0.098L266,316.301l-41.566,21.835c-6.111,3.211-8.463,10.768-5.253,16.88 c2.236,4.257,6.58,6.689,11.077,6.689C232.217,361.705,234.206,361.243,236.061,360.269z"
|
||||
/>
|
||||
<path
|
||||
d="M342.377,280.248c-39.021-16.042-39.54-47.6-39.542-49.04c0.034-4.398-3.491-8.002-7.895-8.06c-0.036,0-0.072,0-0.107,0 c-4.369,0-7.939,3.513-7.997,7.895c-0.023,1.774-0.003,43.671,49.457,64.005c0.995,0.409,2.025,0.603,3.039,0.603 c3.146,0,6.131-1.869,7.402-4.96C348.415,286.603,346.463,281.929,342.377,280.248z"
|
||||
/>
|
||||
<circle cx="90.083" cy="94.916" r="10.333" />
|
||||
<path
|
||||
d="M213.333,254.334v-11.835c16.475-1.67,29.333-15.583,29.333-32.499s-12.858-30.829-29.333-32.498v-11.835h-6.667v11.835 c-16.476,1.67-29.333,15.582-29.333,32.498s12.858,30.829,29.333,32.499v11.835H213.333z M185.333,210 c0-13.601,11.065-24.667,24.667-24.667s24.667,11.065,24.667,24.667S223.601,234.667,210,234.667S185.333,223.602,185.333,210z"
|
||||
/>
|
||||
<path d="M226.667,210c0-9.19-7.477-16.667-16.667-16.667S193.333,200.81,193.333,210s7.477,16.667,16.667,16.667 S226.667,219.19,226.667,210z" />
|
||||
<circle cx="70" cy="118.249" r="6.25" />
|
||||
<rect x="106.083" y="58.916" width="200" height="3.333" />
|
||||
</g>
|
||||
</svg>
|
||||
</template>
|
||||
17
src/assets/datacite/smallBadge.vue
Normal file
17
src/assets/datacite/smallBadge.vue
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
<template>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
version="1.1"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="0 0 100 125"
|
||||
enable-background="new 0 0 100 100"
|
||||
xml:space="preserve"
|
||||
>
|
||||
<path
|
||||
fill="brown"
|
||||
d="M95.281,30.258H4.718V50v19.741h90.563L83.437,50L95.281,30.258z M87.586,32.014H90.9v3.314h-3.314V32.014z M81.346,32.014 h3.315v3.314h-3.315V32.014z M9.787,67.986H6.472v-3.314h3.315V67.986z M9.787,35.328H6.472v-3.314h3.315V35.328z M16.027,67.986 h-3.315v-3.314h3.315V67.986z M16.027,35.328h-3.315v-3.314h3.315V35.328z M22.266,67.986h-3.315v-3.314h3.315V67.986z M22.266,35.328h-3.315v-3.314h3.315V35.328z M28.506,67.986h-3.315v-3.314h3.315V67.986z M28.506,35.328h-3.315v-3.314h3.315 V35.328z M34.745,67.986H31.43v-3.314h3.315V67.986z M34.745,35.328H31.43v-3.314h3.315V35.328z M40.984,67.986H37.67v-3.314h3.314 V67.986z M40.984,35.328H37.67v-3.314h3.314V35.328z M47.224,67.986h-3.315v-3.314h3.315V67.986z M47.224,35.328h-3.315v-3.314 h3.315V35.328z M53.464,67.986h-3.315v-3.314h3.315V67.986z M53.464,35.328h-3.315v-3.314h3.315V35.328z M59.703,67.986h-3.315 v-3.314h3.315V67.986z M59.703,35.328h-3.315v-3.314h3.315V35.328z M65.941,67.986h-3.313v-3.314h3.313V67.986z M65.941,35.328 h-3.313v-3.314h3.313V35.328z M72.181,67.986h-3.313v-3.314h3.313V67.986z M72.181,35.328h-3.313v-3.314h3.313V35.328z M78.421,67.986h-3.314v-3.314h3.314V67.986z M78.421,35.328h-3.314v-3.314h3.314V35.328z M87.586,64.672H90.9v3.314h-3.314V64.672z M84.661,64.672v3.314h-3.315v-3.314H84.661z"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
74
src/assets/datacite/testLogo.vue
Normal file
74
src/assets/datacite/testLogo.vue
Normal file
|
|
@ -0,0 +1,74 @@
|
|||
<template>
|
||||
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg
|
||||
version="1.1"
|
||||
id="Layer_1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
x="0px"
|
||||
y="0px"
|
||||
viewBox="-250 351.8 229.3 91.5"
|
||||
style="enable-background: new -250 351.8 229.3 91.5"
|
||||
xml:space="preserve"
|
||||
>
|
||||
<g>
|
||||
<g>
|
||||
<g>
|
||||
<path
|
||||
id="SVGID_1_"
|
||||
class="st0"
|
||||
d="M-138.4,387.7h-4.6c-1.2,0-2,0.3-2.6,0.7c-0.6,0.4-0.9,1.2-0.9,2.1c0,1.8,1.2,2.7,3.5,2.7
|
||||
c0.8,0,1.5-0.1,2.1-0.2c0.5-0.2,1.1-0.5,1.5-0.9c0.5-0.5,0.8-1.5,0.8-2.9v-1.5H-138.4z M-138.3,396.2v-1.7
|
||||
c-0.7,0.7-1.4,1.3-2.2,1.5c-0.8,0.3-1.7,0.5-3,0.5c-1.2,0-2.2-0.2-3.1-0.5c-0.9-0.3-1.6-0.7-2.2-1.4c-1-1.1-1.5-2.4-1.5-4.1
|
||||
c0-1.1,0.3-2.1,0.8-2.9c0.5-0.8,1.3-1.5,2.2-2c1-0.4,2.2-0.7,3.7-0.7h5.1v-1.4c0-1.3-0.4-2.2-1-2.7c-0.6-0.5-1.7-0.9-3.2-0.9
|
||||
c-1.1,0-1.9,0.2-2.5,0.4c-0.6,0.3-1.2,0.7-1.7,1.4l-2.5-2.4c0.9-1.1,1.9-1.8,2.9-2.2c1.1-0.5,2.4-0.6,4.1-0.6c5.3,0,8,2.2,8,6.7
|
||||
v13L-138.3,396.2L-138.3,396.2z M-153.4,392.9h1.6v3.3h-2.3c-1.2,0-2.2-0.3-2.9-0.7c-0.8-0.5-1.4-1.2-1.8-2s-0.6-1.7-0.6-2.7
|
||||
v-10.7h-2.2v-3h2.2v-5.9h3.9v5.9h3.8v3h-3.8v10.4C-155.6,392.2-154.9,392.9-153.4,392.9z M-167.9,387.7h-4.6
|
||||
c-1.2,0-2,0.3-2.6,0.7c-0.6,0.4-0.9,1.2-0.9,2.1c0,1.8,1.2,2.7,3.5,2.7c0.8,0,1.5-0.1,2.1-0.2c0.5-0.2,1.1-0.5,1.5-0.9
|
||||
c0.5-0.5,0.8-1.5,0.8-2.9v-1.5H-167.9z M-167.8,396.2v-1.7c-0.7,0.7-1.4,1.3-2.2,1.5s-1.7,0.5-3,0.5c-1.2,0-2.2-0.2-3.1-0.5
|
||||
c-0.9-0.3-1.6-0.7-2.2-1.4c-1-1.1-1.5-2.4-1.5-4.1c0-1.1,0.3-2.1,0.8-2.9c0.5-0.8,1.3-1.5,2.2-2c1-0.4,2.2-0.7,3.7-0.7h5.1v-1.4
|
||||
c0-1.3-0.4-2.2-1-2.7s-1.7-0.9-3.2-0.9c-1.1,0-1.9,0.2-2.5,0.4c-0.6,0.3-1.2,0.7-1.7,1.4l-2.5-2.4c0.9-1.1,1.9-1.8,2.9-2.2
|
||||
c1.1-0.5,2.4-0.6,4.1-0.6c5.3,0,8,2.2,8,6.7v13L-167.8,396.2L-167.8,396.2z M-186.2,378.8c-0.1-0.8-0.2-1.6-0.4-2.4
|
||||
c-0.2-0.7-0.5-1.4-1-1.9c-1.1-1.3-2.7-1.9-4.6-1.9h-5.1v19.8h5c2,0,3.5-0.6,4.6-1.8c0.6-0.7,1.1-1.7,1.2-2.9
|
||||
c0.2-1.3,0.3-3,0.3-5.3C-186.2,380.9-186.2,379.7-186.2,378.8z M-182.2,387.6c-0.1,1.1-0.4,2.2-0.8,3.2c-0.4,1.1-1,2-1.8,2.8
|
||||
c-1.7,1.7-4.1,2.5-7,2.5h-9.5V369h9.5c3,0,5.3,0.8,7,2.5c0.8,0.8,1.4,1.7,1.8,2.7c0.4,1,0.6,2.1,0.8,3.1c0.1,1.1,0.2,2.2,0.2,3.7
|
||||
v1.4v1.3C-182.1,385.3-182.1,386.5-182.2,387.6z"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path
|
||||
id="SVGID_3_"
|
||||
class="st1"
|
||||
d="M-77.6,383.9c-0.1-0.4-0.3-0.9-0.4-1.5c-0.4-1-1-1.7-1.9-2.2c-0.9-0.5-1.8-0.8-2.9-0.8
|
||||
c-1.1,0-2,0.3-2.9,0.8c-0.9,0.5-1.5,1.4-1.9,2.2c-0.3,0.6-0.4,1.1-0.4,1.5c-0.1,0.4-0.2,1.1-0.2,1.9h10.8
|
||||
C-77.5,385-77.5,384.3-77.6,383.9z M-88.3,387.4c0,2.3,0.5,4.1,1.5,5.4c1,1.3,2.5,1.9,4.4,1.9c1.1,0,2-0.2,2.7-0.5
|
||||
c0.7-0.4,1.5-0.9,2.3-1.7l1.4,1.2c-1,1-2,1.7-3,2.2c-1,0.4-2.2,0.6-3.7,0.6c-1.7,0-3.2-0.4-4.3-1.1c-1.2-0.7-2.1-1.8-2.6-3.1
|
||||
c-0.6-1.4-0.9-3.1-0.9-5.2c0-1.5,0.2-2.8,0.5-4c0.4-1.2,0.8-2.2,1.4-3s1.4-1.4,2.3-1.9c0.9-0.4,2-0.6,3.1-0.6
|
||||
c1.2,0,2.2,0.2,3.1,0.6c0.9,0.4,1.7,1,2.3,1.8c0.6,0.8,1.2,1.7,1.4,2.8c0.4,1.1,0.5,2.3,0.5,3.8v0.9H-88.3z M-94.4,394.5h1.3v1.7
|
||||
h-1.7c-0.9,0-1.7-0.2-2.4-0.6c-0.6-0.4-1.2-1-1.5-1.7c-0.4-0.7-0.5-1.5-0.5-2.5v-12.1h-2.5v-1.4h2.5V372h2v5.9h4.1v1.4h-4.1v12.1
|
||||
C-97.3,393.5-96.3,394.5-94.4,394.5z M-105.2,396.2h-2v-18.4h2V396.2z M-107.4,371.4V369h2.4v2.4H-107.4z M-116.4,372.3
|
||||
c-1.3-1.2-2.8-1.7-4.6-1.7c-1,0-1.9,0.2-2.8,0.5c-0.9,0.4-1.7,0.9-2.3,1.5c-0.5,0.4-0.9,1-1.2,1.5s-0.4,1.2-0.6,2
|
||||
c-0.2,0.8-0.3,1.7-0.3,2.7s-0.1,2.2-0.1,3.7c0,2.2,0,3.8,0.1,5c0.1,1.2,0.3,2.1,0.5,2.9c0.3,0.8,0.7,1.5,1.3,2.1
|
||||
c0.7,0.7,1.4,1.2,2.3,1.5c0.9,0.4,1.8,0.5,2.8,0.5c1.2,0,2.3-0.3,3.3-0.7s1.8-1.2,2.5-2.2c0.7-0.9,1.2-2,1.4-3.2h2
|
||||
c-0.3,1.6-0.9,3.1-1.7,4.2c-0.8,1.2-1.9,2.1-3.2,2.7c-1.3,0.6-2.7,1-4.3,1c-1.3,0-2.5-0.3-3.7-0.7c-1.2-0.4-2.2-1.2-3.1-2.1
|
||||
c-0.8-0.8-1.3-1.6-1.7-2.5c-0.4-0.9-0.5-1.9-0.6-3.1c-0.1-1.2-0.1-3-0.1-5.4s0-4.2,0.1-5.4c0.1-1.2,0.3-2.2,0.6-3.1
|
||||
s0.9-1.7,1.7-2.5c0.9-0.9,1.9-1.5,3.1-2.1c1.3-0.5,2.5-0.7,3.9-0.7c1.6,0,3.1,0.4,4.3,1s2.3,1.5,3.2,2.7c0.8,1.2,1.4,2.6,1.7,4.2
|
||||
h-2.1C-114.3,374.8-115.2,373.4-116.4,372.3z"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<path
|
||||
class="st2"
|
||||
d="M-236.2,375.1c-0.3,0-0.5,0-0.8,0c7.6,0.8,14.3,3.7,11.6,8.4c-3,5.1-15.5,8.5-26.2,8.5
|
||||
c0.3,0.1,0.6,0.1,0.9,0.2c14.4,2.9,35.9-0.9,38.6-7.9C-210.1,378.6-222.1,374.6-236.2,375.1z"
|
||||
/>
|
||||
<path
|
||||
class="st3"
|
||||
d="M-220.2,391.9c-2.5,15.2-15.6,6.1-18.7-4.5c-4.5-10.9-0.5-25,10.7-16.8c-9.3-4.2-10.2,8.1-6.3,16.8
|
||||
c3.3,7.3,10.4,12,14,4.5C-220.4,392-220.2,392-220.2,391.9z"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
</template>
|
||||
7
src/assets/datacite/viewIcon.vue
Normal file
7
src/assets/datacite/viewIcon.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
|
||||
<path
|
||||
d="M288 144a110.94 110.94 0 0 0-31.24 5 55.4 55.4 0 0 1 7.24 27 56 56 0 0 1-56 56 55.4 55.4 0 0 1-27-7.24A111.71 111.71 0 1 0 288 144zm284.52 97.4C518.29 135.59 410.93 64 288 64S57.68 135.64 3.48 241.41a32.35 32.35 0 0 0 0 29.19C57.71 376.41 165.07 448 288 448s230.32-71.64 284.52-177.41a32.35 32.35 0 0 0 0-29.19zM288 400c-98.65 0-189.09-55-237.93-144C98.91 167 189.34 112 288 112s189.09 55 237.93 144C477.1 345 386.66 400 288 400z"
|
||||
/>
|
||||
</svg>
|
||||
</template>
|
||||
136
src/components/datacite/BaseWidget.ts
Normal file
136
src/components/datacite/BaseWidget.ts
Normal file
|
|
@ -0,0 +1,136 @@
|
|||
import axios from "axios";
|
||||
import { ComponentBase, Vue, Prop } from "vue-facing-decorator";
|
||||
import testLogo from "@/assets/datacite/testLogo.vue";
|
||||
|
||||
const APIURL = "https://api.datacite.org";
|
||||
|
||||
@ComponentBase({
|
||||
name: "BaseWidget",
|
||||
components: {
|
||||
testLogo,
|
||||
},
|
||||
})
|
||||
export default class BaseWidget extends Vue {
|
||||
@Prop({
|
||||
type: Object,
|
||||
required: false,
|
||||
validator(value) {
|
||||
const keys = Object.keys(value);
|
||||
return ["citations", "views", "downloads"].some((r) => keys.includes(r));
|
||||
},
|
||||
})
|
||||
dataInput = {};
|
||||
|
||||
@Prop({
|
||||
type: String,
|
||||
required: true,
|
||||
validator(value) {
|
||||
return value.match(/^10\.\d{4,5}\/[-._;()/:a-zA-Z0-9*~$=]+/);
|
||||
},
|
||||
})
|
||||
doi!: string;
|
||||
|
||||
@Prop({
|
||||
type: String,
|
||||
required: true,
|
||||
validator(value) {
|
||||
return ["small", "medium", "datacite", "regular"].indexOf(value) > -1;
|
||||
},
|
||||
})
|
||||
display!: string;
|
||||
|
||||
public views = "";
|
||||
public citations = "";
|
||||
public downloads = "";
|
||||
private datacite: string | number = "";
|
||||
private loading = false;
|
||||
private errored = false;
|
||||
|
||||
get url() {
|
||||
return `${APIURL}/graphql`;
|
||||
}
|
||||
|
||||
get link() {
|
||||
return `https://commons.datacite.org/doi.org/${this.doi}`;
|
||||
}
|
||||
// get dataInputApi() {
|
||||
// return this.viewsDistribution;
|
||||
// }
|
||||
get alt() {
|
||||
return `${Number(this.views)} Views ${Number(this.downloads)} Downloads ${Number(this.citations)} Citations from DataCite`;
|
||||
}
|
||||
get tooltip() {
|
||||
let message = "";
|
||||
message += `${this.doi} `;
|
||||
message += this.datacite ? `${this.datacite} from DataCite ` : "";
|
||||
return message;
|
||||
}
|
||||
|
||||
getMetrics() {
|
||||
if (this.isLocal() === false) {
|
||||
this.requestMetrics();
|
||||
} else {
|
||||
this.grabMetrics(this.dataInput);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
public pluralize(value: number | string = 0, label: string) {
|
||||
if (value === 1) {
|
||||
return `${value.toLocaleString("en-us")} ${label}`;
|
||||
}
|
||||
return `${value.toLocaleString("en-us")} ${label}s`;
|
||||
}
|
||||
|
||||
public formatNumbers(num: any) {
|
||||
if (num < 1e3) return num;
|
||||
if (num >= 1e3 && num < 1e6) return `${+(num / 1e3).toFixed(1)}K`;
|
||||
if (num >= 1e6 && num < 1e9) return `${+(num / 1e6).toFixed(1)}M`;
|
||||
if (num >= 1e9 && num < 1e12) return `${+(num / 1e9).toFixed(1)}B`;
|
||||
if (num >= 1e12) return `${+(num / 1e12).toFixed(1)}T`;
|
||||
return num;
|
||||
}
|
||||
|
||||
private isLocal(): boolean {
|
||||
if (this.dataInput == null && typeof this.doi !== "undefined") {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
private grabMetrics(data: any) {
|
||||
this.views = (this.formatNumbers(data.views) as string) || "";
|
||||
this.downloads = (this.formatNumbers(data.downloads) as string) || "";
|
||||
this.citations = (this.formatNumbers(data.citations) as string) || "";
|
||||
this.datacite = this.formatNumbers(data.datacite) || "";
|
||||
}
|
||||
|
||||
private requestMetrics() {
|
||||
axios({
|
||||
url: this.url,
|
||||
method: "post",
|
||||
data: {
|
||||
query: `
|
||||
{
|
||||
counts: work(id: "${this.doi}") {
|
||||
id
|
||||
views: viewCount
|
||||
downloads: downloadCount
|
||||
citations: citationCount
|
||||
}
|
||||
}
|
||||
`,
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
this.grabMetrics(response.data.data.counts);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error);
|
||||
this.errored = true;
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
43
src/components/datacite/BaseWidget.vue
Normal file
43
src/components/datacite/BaseWidget.vue
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
<script lang="ts">
|
||||
import BaseWidget from "./BaseWidget";
|
||||
export default BaseWidget;
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
/* https://stackoverflow.com/questions/12675622/script1028-expected-identifier-string-or-number */
|
||||
.icon-metrics {
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
a {
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family: "Cairo", "Helvetica", Arial, sans-serif;
|
||||
vertical-align: top;
|
||||
}
|
||||
a {
|
||||
color: #222222;
|
||||
-webkit-transition: all 150ms linear;
|
||||
-moz-transition: all 150ms linear;
|
||||
-o-transition: all 150ms linear;
|
||||
-ms-transition: all 150ms linear;
|
||||
transition: all 150ms linear;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover,
|
||||
a:focus {
|
||||
color: #222222;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:focus,
|
||||
a:active {
|
||||
outline: 0;
|
||||
}
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
63
src/components/datacite/DataMetricsBadge.vue
Normal file
63
src/components/datacite/DataMetricsBadge.vue
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
<template>
|
||||
<div v-bind:title="'Metrics for DOI: ' + doi">
|
||||
<div v-if="doi">
|
||||
<!-- <div v-if="display == 'small'"> -->
|
||||
<SmallWidget v-bind:doi="doi" v-bind:display="display" :data-input="dataObject" />
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<a v-else>There is no DOI</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import SmallWidget from "./SmallWidget.vue";
|
||||
// import MediumWidget from "./MediumWidget.vue";
|
||||
// import DataCiteWidget from "./DataCiteWidget.vue";
|
||||
// import RegularWidget from "./RegularWidget.vue";
|
||||
|
||||
import { Vue, Component, Prop } from "vue-facing-decorator";
|
||||
|
||||
@Component({
|
||||
name: "DataMetricsBadge",
|
||||
components: {
|
||||
// MediumWidget,
|
||||
SmallWidget,
|
||||
// DataCiteWidget,
|
||||
// RegularWidget,
|
||||
},
|
||||
})
|
||||
export default class DataMetricsBadge extends Vue {
|
||||
name = "DataMetricsBadge";
|
||||
funtional = true;
|
||||
|
||||
@Prop({
|
||||
type: Object,
|
||||
})
|
||||
dataInput!: object;
|
||||
|
||||
@Prop({
|
||||
type: String,
|
||||
default: "",
|
||||
})
|
||||
doi!: string;
|
||||
|
||||
@Prop({
|
||||
type: String,
|
||||
required: false,
|
||||
validator(value) {
|
||||
return ["small", "medium", "datacite", "regular"].indexOf(value) > -1;
|
||||
},
|
||||
default: "small",
|
||||
})
|
||||
display!: string;
|
||||
|
||||
get dataObject() {
|
||||
// if (typeof this.dataInput !== "undefined") {
|
||||
return this.dataInput;
|
||||
// }
|
||||
// return null;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
143
src/components/datacite/SmallWidget.vue
Normal file
143
src/components/datacite/SmallWidget.vue
Normal file
|
|
@ -0,0 +1,143 @@
|
|||
<template>
|
||||
<div class="small-container">
|
||||
<a v-bind:href="link">
|
||||
<div class="d-flex">
|
||||
<!-- <test-logo v-bind:class="'svglogo'" /> -->
|
||||
<div v-bind:class="['', '0', 0].includes(citations) == false ? activeClass : inactiveClass">Citations</div>
|
||||
<div class="p-2 counts" v-bind:title="pluralize(citations, 'Citation')">
|
||||
{{ formatNumbers(["", "0", 0].includes(citations) == false ? citations : " ") }}
|
||||
</div>
|
||||
<div class="p-2 span" />
|
||||
|
||||
<div v-if="parseInt(views) + parseInt(downloads) > 0" class="d-flex">
|
||||
<div v-bind:class="['', '0', 0].includes(views) == false ? activeClass : inactiveClass">Views</div>
|
||||
<div class="p-2 counts" v-bind:title="pluralize(views, 'View')">
|
||||
{{ formatNumbers(["", "0", 0].includes(views) == false ? views : " ") }}
|
||||
</div>
|
||||
<div class="p-2 span" />
|
||||
|
||||
<div v-bind:class="['', '0', 0].includes(downloads) == false ? activeClass : inactiveClass">Downloads</div>
|
||||
<div class="p-2 counts" v-bind:title="pluralize(downloads, 'Download')">
|
||||
{{ formatNumbers(["", "0", 0].includes(downloads) == false ? downloads : " ") }}
|
||||
</div>
|
||||
<div class="p-2 span" />
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component } from "vue-facing-decorator";
|
||||
import BaseWidget from "./BaseWidget.vue";
|
||||
// import testLogo from "@/assets/datacite/testLogo.vue";
|
||||
|
||||
@Component({
|
||||
name: "SmallWidget",
|
||||
})
|
||||
export default class SmallWidget extends BaseWidget {
|
||||
public activeClass = "p-2 label";
|
||||
public inactiveClass = "p-2 label-empty";
|
||||
|
||||
public mounted(): void {
|
||||
this.getMetrics();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
div.label {
|
||||
background-color: rgba(0, 89, 173);
|
||||
display: table;
|
||||
width: 8%;
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
border-style: solid;
|
||||
/* font-weight: bold; */
|
||||
border-color: rgba(0, 89, 173);
|
||||
border-width: thin;
|
||||
/* text-align: center; */
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
div.logo {
|
||||
min-width: 100px;
|
||||
padding: 0px 0px 0px 0px;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
.svglogo {
|
||||
color: #455a64;
|
||||
fill: #455a64;
|
||||
display: table;
|
||||
width: 20%;
|
||||
min-width: 100px;
|
||||
}
|
||||
|
||||
div.counts {
|
||||
background-color: white;
|
||||
display: table;
|
||||
/* font-size: 2.5vh; */
|
||||
font-size: 12px;
|
||||
width: 6%;
|
||||
border-style: solid;
|
||||
font-weight: bold;
|
||||
border-color: #78909c;
|
||||
border-width: thin;
|
||||
text-align: center;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
div.span {
|
||||
background-color: white;
|
||||
display: table;
|
||||
font-size: 2.5vh;
|
||||
width: 2%;
|
||||
}
|
||||
|
||||
.small-container {
|
||||
width: 100%;
|
||||
min-width: 400px;
|
||||
max-width: 400px;
|
||||
/*
|
||||
max-height: 15px;
|
||||
padding-right: 15px;
|
||||
padding-left: 15px; */
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
/* font-family: Arial, Helvetica, sans-serif; */
|
||||
}
|
||||
|
||||
.d-flex {
|
||||
display: -ms-flexbox !important;
|
||||
display: flex !important;
|
||||
}
|
||||
|
||||
.p-2 {
|
||||
padding: 0.1rem !important;
|
||||
}
|
||||
|
||||
.label-empty {
|
||||
background-color: #78909c;
|
||||
display: table;
|
||||
width: 8%;
|
||||
color: white;
|
||||
/* font-size: 2.5vh; */
|
||||
font-size: 12px;
|
||||
border-style: solid;
|
||||
font-weight: bold;
|
||||
border-color: #78909c;
|
||||
border-width: thin;
|
||||
text-align: center;
|
||||
height: 15px;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -98,6 +98,7 @@ export class DbDataset {
|
|||
public licenses: Array<License>,
|
||||
public references: Array<Reference>,
|
||||
public files: Array<DbFile>,
|
||||
public identifier: Identifier,
|
||||
private coverage?: Coverage,
|
||||
public project?: Project,
|
||||
) {}
|
||||
|
|
@ -398,3 +399,13 @@ export interface HashValue {
|
|||
type: string;
|
||||
value: string;
|
||||
}
|
||||
|
||||
export interface Identifier {
|
||||
created_at: string;
|
||||
dataset_id: number;
|
||||
id: number;
|
||||
status: string; //'findable'
|
||||
type: string; //'doi'
|
||||
updated_at: string; //'2023-03-09T09:48:28.000Z'
|
||||
value: string; //'10.24341/tethys.209'
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,11 +9,14 @@ import advancedFormat from "dayjs/plugin/advancedFormat";
|
|||
import VsInput from "@/components/vs-input/vs-input.vue";
|
||||
import { Suggestion } from "@/models/dataset";
|
||||
import { VUE_APP_PORTAL } from "@/constants";
|
||||
// import DataMetricsBadge from "data-metrics-badge/dist/data-metrics-badge.js";
|
||||
import DataMetricsBadge from "@/components/datacite/DataMetricsBadge.vue";
|
||||
|
||||
@Component({
|
||||
name: "DatasetDetailComponent",
|
||||
components: {
|
||||
VsInput,
|
||||
DataMetricsBadge,
|
||||
},
|
||||
})
|
||||
export default class DatasetDetailComponent extends Vue {
|
||||
|
|
@ -29,6 +32,12 @@ export default class DatasetDetailComponent extends Vue {
|
|||
public openAccessLicences: Array<string> = ["CC-BY-4.0", "CC-BY-SA-4.0"];
|
||||
public portal = VUE_APP_PORTAL + "/api/file/download/";
|
||||
|
||||
public post = {
|
||||
views: 25,
|
||||
downloads: 1262,
|
||||
citations: 2424,
|
||||
};
|
||||
|
||||
created(): void {
|
||||
dayjs.extend(advancedFormat);
|
||||
this.getDataset(this.datasetId);
|
||||
|
|
|
|||
|
|
@ -156,6 +156,9 @@
|
|||
<div class="card">
|
||||
<div class="column">
|
||||
<h2 class="label uppercase">Details</h2>
|
||||
<!-- <data-metrics-badge doi="10.7272/q6g15xs4" display="regular"></data-metrics-badge> -->
|
||||
<!-- <data-metrics-badge doi="10.24341/tethys.209" display="small" v-bind:data-input="post"></data-metrics-badge> -->
|
||||
<data-metrics-badge v-bind:doi="dataset.identifier.value" display="small"></data-metrics-badge>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
//what module code is generated
|
||||
"module": "esnext",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user