+
-
+
+
+
+
-
@@ -37,11 +40,19 @@
el: "#app",
data() {
return {
+ isPc: true,
+
loading: false,
longUrl: '',
shortUrl: ''
}
},
+ created() {
+ const os = this.getOS()
+ if (os.isPc !== true) {
+ this.isPc = false
+ }
+ },
mounted() {
this.$refs.long.focus()
},
@@ -53,7 +64,7 @@
let re = new RegExp('http(s*)://[^\s]*')
if (re.exec(this.longUrl) === null) {
this.$message.warning('请输入正确格式的长链接')
- return
+ return
}
this.loading = true
@@ -68,6 +79,8 @@
.then(res => {
if (res.data.Code === 1 && res.data.ShortUrl !== "") {
this.shortUrl = res.data.ShortUrl;
+ this.$copyText(this.shortUrl)
+ this.$message.success("短链接已复制到剪贴板");
} else {
this.$message.error("短链接获取失败：" + res.data.Message);
}
@@ -81,7 +94,31 @@
},
goToGayHub() {
window.open(repo)
- }
+ },
+ getOS() {
+ let ua = navigator.userAgent,
+ isWindowsPhone = /(?:Windows Phone)/.test(ua),
+ isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone,
+ isAndroid = /(?:Android)/.test(ua),
+ isFireFox = /(?:Firefox)/.test(ua),
+ isChrome = /(?:Chrome|CriOS)/.test(ua),
+ isTablet = /(?:iPad|PlayBook)/.test(ua) || (isAndroid && !/(?:Mobile)/.test(ua)) || (isFireFox && /(?:Tablet)/.test(ua)),
+ isPhone = /(?:iPhone)/.test(ua) && !isTablet,
+ isPc = !isPhone && !isAndroid && !isSymbian;
+
+ return {
+ isTablet: isTablet,
+ isPhone: isPhone,
+ isAndroid: isAndroid,
+ isPc: isPc
+ };
+ },
+ getBodyClass() {
+ return this.isPc ? 'body-center body-width-pc' : 'body-center'
+ },
+ onCopy() {
+ this.$message.success("Copied!");
+ },
},
})
@@ -91,11 +128,19 @@
width: 40%;
position: absolute;
left: 50%;
- top: 40%;
+ top: 30%;
transform: translate(-50%, -50%);
text-align: center;
}
+ .body-width-pc {
+ width: 40%;
+ }
+
+ .body-width-mb {
+ width: 90%;
+ }
+
.el-input {
margin-top: 20px;
}