fix: ui
This commit is contained in:
@@ -128,8 +128,25 @@ onUnmounted(() => {
|
||||
<source type="video/mp4" />
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
|
||||
<div v-if="article && !article.bought" class="bg-white border-b border-gray-200 p-4">
|
||||
<div class="flex items-center justify-between max-w-md mx-auto">
|
||||
<div class="text-orange-600 text-2xl">
|
||||
<span class="mr-2 text-xl">¥</span>
|
||||
<span class="font-bold font-mono">
|
||||
{{ (article.price / 100).toFixed(2) }}
|
||||
</span>
|
||||
</div>
|
||||
<button @click="handleBuy" :disabled="buying"
|
||||
class="bg-orange-600 text-white px-8 py-2 rounded hover:bg-orange-500 active:bg-orange-600 transition-colors disabled:opacity-50">
|
||||
<span v-if="buying">处理中...</span>
|
||||
<span v-else>立即购买</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-4">
|
||||
<h1 class="text-2xl my-1.5">{{ article.title }}</h1>
|
||||
<h1 class="text-2xl my-1.5 break-all">{{ article.title }}</h1>
|
||||
<div class="py-2 flex items-center gap-2">
|
||||
<span v-for="tag in article.tags" :key="tag"
|
||||
class="px-1.5 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">
|
||||
@@ -145,18 +162,6 @@ onUnmounted(() => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="article && !article.bought" class="bg-white border-t border-gray-200 p-4">
|
||||
<div class="flex items-center justify-between max-w-md mx-auto">
|
||||
<div class="text-orange-600 font-bold text-xl">
|
||||
¥{{ (article.price / 100).toFixed(2) }}
|
||||
</div>
|
||||
<button @click="handleBuy" :disabled="buying"
|
||||
class="bg-orange-600 text-white px-8 py-3 rounded-full hover:bg-orange-500 active:bg-orange-600 transition-colors disabled:opacity-50">
|
||||
<span v-if="buying">处理中...</span>
|
||||
<span v-else>立即购买</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -83,8 +83,7 @@ onMounted(() => {
|
||||
暂无文章
|
||||
</div>
|
||||
|
||||
<ArticleListItem v-for="article in articles" :key="article.id" :article="{ ...article, bought: true }"
|
||||
class="mb-4" />
|
||||
<ArticleListItem v-for="article in articles" :key="article.id" :article="article" class="mb-4" />
|
||||
|
||||
<div ref="loadingTrigger" class="py-4 text-center" v-show="hasMore || loading">
|
||||
<div v-if="loading"
|
||||
|
||||
Reference in New Issue
Block a user