feat: 添加投标项目查看器组件及后端支持

2026-01-14 00:56:30 +08:00
parent 2fcfb452ec
commit 8e4429558c
24 changed files with 1356 additions and 1 deletions
--- a/widget/looker/frontend/src/App.vue
+++ b/widget/looker/frontend/src/App.vue
@@ -0,0 +1,93 @@
+<script lang="ts" setup>
+import { ref } from 'vue'
+import PinnedBids from './components/PinnedBids.vue'
+
+const activeTab = ref('pinned')
+
+const tabs = [
+  { id: 'pinned', label: '置顶项目' },
+  { id: 'other', label: '其他' }
+]
+</script>
+
+<template>
+  <div class="app-container">
+    <div class="tabs">
+      <button
+        v-for="tab in tabs"
+        :key="tab.id"
+        :class="['tab-button', { active: activeTab === tab.id }]"
+        @click="activeTab = tab.id"
+      >
+        {{ tab.label }}
+      </button>
+    </div>
+
+    <div class="tab-content">
+      <PinnedBids v-if="activeTab === 'pinned'"/>
+      <div v-else class="placeholder">
+        <p>暂无内容</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style>
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+  background: #f5f5f5;
+}
+
+.app-container {
+  min-height: 100vh;
+  background: #f5f5f5;
+}
+
+.tabs {
+  display: flex;
+  background: #fff;
+  border-bottom: 1px solid #e0e0e0;
+  padding: 0 20px;
+}
+
+.tab-button {
+  padding: 16px 24px;
+  background: none;
+  border: none;
+  border-bottom: 2px solid transparent;
+  font-size: 14px;
+  font-weight: 500;
+  color: #666;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.tab-button:hover {
+  color: #333;
+  background: #f9f9f9;
+}
+
+.tab-button.active {
+  color: #3498db;
+  border-bottom-color: #3498db;
+}
+
+.tab-content {
+  padding: 20px;
+}
+
+.placeholder {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 400px;
+  color: #999;
+  font-size: 16px;
+}
+</style>