A1300399510/PC-detailScreenshot
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

删除顶部的tab

Browse Source
This commit is contained in:
A1300399510 2024-09-10 14:47:51 +08:00
parent 7e4169a74e
commit c1be38d400
3 changed files with 21 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
css/style.css
View File

@ -33,37 +33,11 @@
flex-direction: column;
align-items: center;
}
.tab-box {
width: 490px;
display: flex;
align-items: center;
margin-top: 20px;
margin-bottom: 20px;
}
.tab-box .tab {
width: 150px;
height: 40px;
display: flex;
align-items: center;
margin: 0 auto;
border: 1px solid #eee;
border-radius: 20px;
}
.tab-box .tab .item {
flex: 1;
border-radius: 20px;
text-align: center;
line-height: 40px;
cursor: pointer;
}
.tab-box .tab .item.pitch {
background-color: #f7a60a;
color: #fff;
}
.operate {
width: 490px;
display: flex;
justify-content: center;
margin-top: 10px;
}
.operate input {
flex: 1;
@ -82,6 +56,9 @@
line-height: 40px;
cursor: pointer;
}
.operate .btn.disabled {
cursor: not-allowed;
}
.main {
width: 450px;
padding: 20px 0 0;
@ -452,6 +429,7 @@
top: 0;
left: 0;
z-index: 1;
user-select: none;
}
.pop-up .select {
width: 600px;
@ -471,6 +449,7 @@
width: 400px;
height: 400px;
overflow: hidden;
user-select: all;
}
.pop-up .select .img-box .img {
height: 400px;

36
css/style.less
View File

@ -39,41 +39,12 @@
flex-direction: column;
align-items: center;
}
.tab-box {
width: 490px;
display: flex;
align-items: center;
margin-top: 20px;
margin-bottom: 20px;
.tab {
width: 150px;
height: 40px;
display: flex;
align-items: center;
margin: 0 auto;
border: 1px solid #eee;
border-radius: 20px;
.item {
flex: 1;
border-radius: 20px;
text-align: center;
line-height: 40px;
cursor: pointer;
&.pitch {
background-color: #f7a60a;
color: #fff;
}
}
}
}
.operate {
width: 490px;
display: flex;
justify-content: center;
margin-top: 10px;
input {
flex: 1;
height: 40px;
@ -91,6 +62,9 @@
text-align: center;
line-height: 40px;
cursor: pointer;
&.disabled {
cursor: not-allowed;
}
}
}
.main {
@ -527,6 +501,7 @@
top: 0;
left: 0;
z-index: 1;
user-select: none;
.select {
width: 600px;
height: 500px;
@ -544,6 +519,7 @@
width: 400px;
height: 400px;
overflow: hidden;
user-select: all;
.img {
// width: 400px;
height: 400px;

25
index.html
View File

@ -12,17 +12,10 @@
</head>
<body>
<div id="app">
<div class="tab-box">
<div class="tab">
<div class="item" :class="{'pitch': tab == 'offer'}" @click="cutTab('offer')">Offer</div>
<div class="item" :class="{'pitch': tab == 'summary'}" @click="cutTab('summary')">总结</div>
</div>
</div>
<div class="operate flexacenter">
<input placeholder="请输入" v-model="inputText" @keyup.enter="confirm()" />
<div class="btn" @click="confirm()">确定</div>
<div class="btn" @click="saveimage()">生成图片</div>
<div class="btn" :class="{ disabled: !isClickable }" :disabled="!isClickable" @click="saveimage()">生成图片</div>
</div>
<div class="main">
<template v-if="tab == 'offer' && JSON.stringify(offerinfo) !== '{}'">
@ -458,6 +451,11 @@
this.arrowyellow = arrowyellow
this.arrowsgray = arrowsgray
},
computed: {
isClickable() {
return JSON.stringify(this.offerinfo) !== '{}' || JSON.stringify(this.info) !== '{}'
},
},
methods: {
getBase64ImageFromURL(type, index) {
if (type == "offer") {
@ -721,18 +719,13 @@
this.personalBgGraduate = personalBgGraduate
},
// 切换类型
cutTab(key) {
this.offerinfo = {}
this.info = {}
if (key == this.tab) return
this.tab = key
},
// 确定
confirm() {
if (!this.inputText) return
if (this.inputText.indexOf("/details/") > 0) this.tab = "offer"
else this.tab = "summary"
if (this.inputText.indexOf("http") != -1) this.inputId = this.inputText.substring(this.inputText.lastIndexOf("/") + 1)
else this.inputId = this.inputText