Polish chat layout and simplify pilot UI controls
This commit is contained in:
@@ -222,34 +222,6 @@ const loginPassword = ref("");
|
||||
const loginError = ref<string | null>(null);
|
||||
const loginBusy = ref(false);
|
||||
|
||||
const userMood = computed(() => {
|
||||
const hour = new Date().getHours();
|
||||
if (hour < 12) return "⚡";
|
||||
if (hour < 18) return "🚀";
|
||||
return "🌙";
|
||||
});
|
||||
|
||||
const userInitial = computed(() => {
|
||||
const name = authMe.value?.user?.name?.trim();
|
||||
if (!name) return "U";
|
||||
return name.charAt(0).toUpperCase();
|
||||
});
|
||||
|
||||
const activeChatConversation = computed<ChatConversation | null>(() => {
|
||||
const activeId = authMe.value?.conversation.id;
|
||||
if (!activeId) return null;
|
||||
const fromList = chatConversations.value.find((item) => item.id === activeId);
|
||||
if (fromList) return fromList;
|
||||
return {
|
||||
id: activeId,
|
||||
title: authMe.value?.conversation.title ?? "Current chat",
|
||||
createdAt: "",
|
||||
updatedAt: "",
|
||||
lastMessageAt: null,
|
||||
lastMessageText: null,
|
||||
};
|
||||
});
|
||||
|
||||
watch(
|
||||
() => authMe.value?.conversation.id,
|
||||
(id) => {
|
||||
@@ -1243,9 +1215,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
<div class="pilot-header">
|
||||
<div>
|
||||
<h2 class="text-sm font-semibold uppercase tracking-wide text-white/75">Pilot Chat</h2>
|
||||
<p class="mt-1 text-xs text-white/60">
|
||||
{{ authMe.team.name }} · {{ authMe.user.name }} · {{ authMe.conversation.title }}
|
||||
</p>
|
||||
</div>
|
||||
<button
|
||||
class="btn btn-ghost btn-xs btn-square text-white/80 hover:bg-white/10"
|
||||
@@ -1281,10 +1250,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
{{ chatCreating ? "..." : "New chat" }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="pilot-thread-current">
|
||||
<p class="truncate text-xs font-semibold text-white/90">{{ activeChatConversation?.title || "Current chat" }}</p>
|
||||
<p class="truncate text-[11px] text-white/55">{{ activeChatConversation?.lastMessageText || "No messages yet" }}</p>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<select
|
||||
v-model="selectedChatId"
|
||||
@@ -1372,7 +1337,9 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
@keyup.enter="sendPilotMessage"
|
||||
>
|
||||
<button class="btn btn-sm border-0 bg-[#5865f2] text-white hover:bg-[#4752c4]" :disabled="pilotSending" @click="sendPilotMessage">
|
||||
{{ pilotSending ? "Sending..." : "Send" }}
|
||||
<svg viewBox="0 0 24 24" class="h-4 w-4 fill-current" :class="pilotSending ? 'opacity-50' : ''">
|
||||
<path d="M4.5 19.5 21 12 4.5 4.5l.02 5.84L15 12l-10.48 1.66z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1382,13 +1349,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
<div class="flex h-full min-h-0 flex-col pb-20 md:pb-24">
|
||||
<div class="workspace-topbar border-b border-base-300 px-3 py-2 md:px-4">
|
||||
<div class="ml-auto flex items-center gap-2">
|
||||
<div class="inline-flex items-center gap-2 rounded-xl border border-base-300 bg-base-100 px-2 py-1.5">
|
||||
<div class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-primary/15 text-sm font-semibold text-primary">{{ userInitial }}</div>
|
||||
<div class="min-w-0">
|
||||
<p class="truncate text-xs font-semibold">{{ authMe.user.name }} {{ userMood }}</p>
|
||||
<p class="truncate text-[11px] text-base-content/60">{{ authMe.user.phone }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-sm btn-outline" @click="logout">Logout</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1974,9 +1934,7 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
<div class="mb-3 flex items-start justify-between gap-2 border-b border-base-300 pb-2">
|
||||
<div>
|
||||
<p class="font-medium">{{ selectedCommThread.contact }}</p>
|
||||
<p class="text-xs text-base-content/60">{{ selectedCommThread.channels.join(" · ") }}</p>
|
||||
</div>
|
||||
<button class="btn btn-xs btn-outline">Call</button>
|
||||
</div>
|
||||
|
||||
<div class="mb-3 flex items-center justify-between gap-2">
|
||||
@@ -2175,10 +2133,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
</div>
|
||||
|
||||
<template v-else>
|
||||
<p class="text-xs text-base-content/55">
|
||||
Last contact · {{ formatStamp(selectedWorkspaceContact.lastContactAt) }}
|
||||
</p>
|
||||
|
||||
<div v-if="selectedWorkspaceDeal" class="mt-3 rounded-xl border border-base-300 bg-base-200/30 p-2.5">
|
||||
<p class="text-[10px] font-semibold uppercase tracking-wide text-base-content/55">Deal</p>
|
||||
<p class="mt-1 text-sm font-medium">{{ selectedWorkspaceDeal.title }}</p>
|
||||
@@ -2343,13 +2297,6 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.pilot-thread-current {
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
padding: 8px;
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
.pilot-timeline {
|
||||
padding: 10px 8px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user