You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
70 lines
2.6 KiB
70 lines
2.6 KiB
6 years ago
|
<template>
|
||
|
|
<button
|
||
|
|
class="share-button share-button--odnoklassniki"
|
||
|
|
type="button"
|
||
|
|
:class="className"
|
||
|
|
:shareUrl="shareUrl"
|
||
|
|
:shareTitle="shareTitle"
|
||
|
|
:shareDescription="shareDescription"
|
||
|
|
:sharePic="sharePic"
|
||
|
|
:btnText="btnText"
|
||
|
|
:windowWidth="windowWidth"
|
||
|
|
:windowHeight="windowHeight"
|
||
|
|
:hasIcon="hasIcon"
|
||
|
|
:isBlank="isBlank"
|
||
|
|
@click="openShareWindow"
|
||
|
|
>
|
||
|
|
<icon iconName="Odnoklassniki" class="share-button__icon" v-if="hasIcon === true">
|
||
|
|
<path
|
||
|
|
d="M14.505 17.44c1.275-.29 2.493-.794 3.6-1.49.834-.558 1.058-1.686.5-2.52-.536-.802-1.604-1.044-2.435-.553-2.55 1.595-5.79 1.595-8.34 0-.847-.534-1.965-.28-2.5.565 0 .002 0 .004-.002.005-.534.847-.28 1.966.567 2.5l.002.002c1.105.695 2.322 1.2 3.596 1.488l-3.465 3.465c-.707.695-.72 1.83-.028 2.537l.03.03c.344.354.81.53 1.274.53.465 0 .93-.176 1.275-.53L12 20.065l3.404 3.406c.72.695 1.87.676 2.566-.045.678-.703.678-1.818 0-2.52l-3.465-3.466zM12 12.388c3.42-.004 6.19-2.774 6.195-6.193C18.195 2.78 15.415 0 12 0S5.805 2.78 5.805 6.197c.005 3.42 2.776 6.19 6.195 6.192zm0-8.757c1.416.002 2.563 1.15 2.564 2.565 0 1.416-1.148 2.563-2.564 2.565-1.415-.002-2.562-1.148-2.565-2.564C9.437 4.78 10.585 3.633 12 3.63z"
|
||
|
|
/>
|
||
|
|
</icon>
|
||
|
|
<span class="share-button__text" v-if="btnText">{{btnText}}</span>
|
||
|
|
</button>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Icon from "./icon/Icon.vue";
|
||
|
|
import {
|
||
|
|
getDocumentHref,
|
||
|
|
getDocumentTitle,
|
||
|
|
eventEmit,
|
||
|
|
createWindow
|
||
|
|
} from "../helpers";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: "OdnoklassnikiShareButton",
|
||
|
|
components: { Icon },
|
||
|
|
props: {
|
||
|
|
className: { type: String },
|
||
|
|
shareUrl: { type: String, default: getDocumentHref },
|
||
|
|
shareTitle: { type: String, default: "" },
|
||
|
|
shareDescription: { type: String, default: getDocumentTitle },
|
||
|
|
sharePic: { type: String, default: "" },
|
||
|
|
btnText: { type: String, default: "Odnoklassniki" },
|
||
|
|
windowWidth: { type: Number },
|
||
|
|
windowHeight: { type: Number },
|
||
|
|
hasIcon: { type: Boolean, default: true },
|
||
|
|
isBlank: { type: Boolean, default: true }
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
openShareWindow: function() {
|
||
|
|
eventEmit(this, { name: "Odnoklassniki" });
|
||
|
|
const configWindow = createWindow();
|
||
|
|
const url = `https://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl=${encodeURIComponent(
|
||
|
|
this.$props.shareUrl
|
||
|
|
)}&st.comments=${encodeURIComponent(this.$props.shareTitle)}`;
|
||
|
|
|
||
|
|
return this.$props.isBlank
|
||
|
|
? window.open(url, "__blank")
|
||
|
|
: window.open(url, "Share this", configWindow);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
@import "../style/index.css";
|
||
|
|
@import "../style/odnoklassnikiButton.css";
|
||
|
|
</style>
|