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

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>

widget/looker/frontend/src/components/HelloWorld.vue

@@ -0,0 +1,71 @@
+<script lang="ts" setup>
+import {reactive} from 'vue'
+import {Greet} from '../../wailsjs/go/main/App'
+
+const data = reactive({
+  name: "",
+  resultText: "Please enter your name below 👇",
+})
+
+function greet() {
+  Greet(data.name).then(result => {
+    data.resultText = result
+  })
+}
+
+</script>
+
+<template>
+  <main>
+    <div id="result" class="result">{{ data.resultText }}</div>
+    <div id="input" class="input-box">
+      <input id="name" v-model="data.name" autocomplete="off" class="input" type="text"/>
+      <button class="btn" @click="greet">Greet</button>
+    </div>
+  </main>
+</template>
+
+<style scoped>
+.result {
+  height: 20px;
+  line-height: 20px;
+  margin: 1.5rem auto;
+}
+
+.input-box .btn {
+  width: 60px;
+  height: 30px;
+  line-height: 30px;
+  border-radius: 3px;
+  border: none;
+  margin: 0 0 0 20px;
+  padding: 0 8px;
+  cursor: pointer;
+}
+
+.input-box .btn:hover {
+  background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%);
+  color: #333333;
+}
+
+.input-box .input {
+  border: none;
+  border-radius: 3px;
+  outline: none;
+  height: 30px;
+  line-height: 30px;
+  padding: 0 10px;
+  background-color: rgba(240, 240, 240, 1);
+  -webkit-font-smoothing: antialiased;
+}
+
+.input-box .input:hover {
+  border: none;
+  background-color: rgba(255, 255, 255, 1);
+}
+
+.input-box .input:focus {
+  border: none;
+  background-color: rgba(255, 255, 255, 1);
+}
+</style>

widget/looker/frontend/src/components/PinnedBids.vue

@@ -0,0 +1,166 @@
+<script lang="ts" setup>
+import { ref, onMounted } from 'vue'
+import { GetPinnedBidItems } from '../../wailsjs/go/main/App'
+
+interface BidItem {
+  id: string
+  title: string
+  url: string
+  publishDate: string
+  source: string
+  pin: boolean
+  createdAt: string
+  updatedAt: string
+}
+
+const bidItems = ref<BidItem[]>([])
+const loading = ref(true)
+const error = ref('')
+
+const loadPinnedBids = async () => {
+  try {
+    loading.value = true
+    error.value = ''
+    const items = await GetPinnedBidItems()
+    bidItems.value = items
+  } catch (err) {
+    error.value = `加载失败: ${err}`
+    console.error('加载置顶投标项目失败:', err)
+  } finally {
+    loading.value = false
+  }
+}
+
+const openUrl = (url: string) => {
+  window.open(url, '_blank')
+}
+
+onMounted(() => {
+  loadPinnedBids()
+})
+</script>
+
+<template>
+  <div class="pinned-bids-container">
+    <h2 class="title">置顶投标项目</h2>
+
+    <div v-if="loading" class="loading">
+      加载中...
+    </div>
+
+    <div v-else-if="error" class="error">
+      {{ error }}
+    </div>
+
+    <div v-else-if="bidItems.length === 0" class="empty">
+      暂无置顶项目
+    </div>
+
+    <div v-else class="bid-list">
+      <div
+        v-for="item in bidItems"
+        :key="item.id"
+        class="bid-item"
+        @click="openUrl(item.url)"
+      >
+        <div class="bid-header">
+          <span class="source">{{ item.source }}</span>
+          <span class="date">{{ item.publishDate }}</span>
+        </div>
+        <h3 class="bid-title">{{ item.title }}</h3>
+        <div class="bid-footer">
+          <span class="pin-badge">📌 已置顶</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.pinned-bids-container {
+  padding: 20px;
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+.title {
+  font-size: 24px;
+  font-weight: bold;
+  margin-bottom: 20px;
+  color: #333;
+}
+
+.loading,
+.error,
+.empty {
+  text-align: center;
+  padding: 40px;
+  color: #666;
+  font-size: 16px;
+}
+
+.error {
+  color: #e74c3c;
+}
+
+.bid-list {
+  display: grid;
+  gap: 16px;
+}
+
+.bid-item {
+  background: #fff;
+  border: 1px solid #e0e0e0;
+  border-radius: 8px;
+  padding: 16px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.bid-item:hover {
+  border-color: #3498db;
+  box-shadow: 0 2px 8px rgba(52, 152, 219, 0.15);
+  transform: translateY(-2px);
+}
+
+.bid-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.source {
+  background: #f0f0f0;
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #666;
+}
+
+.date {
+  font-size: 12px;
+  color: #999;
+}
+
+.bid-title {
+  font-size: 16px;
+  font-weight: 500;
+  color: #333;
+  margin: 0 0 12px 0;
+  line-height: 1.5;
+}
+
+.bid-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.pin-badge {
+  background: #fff3cd;
+  color: #856404;
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-size: 12px;
+}
+</style>

widget/looker/frontend/src/main.ts

@@ -0,0 +1,5 @@
+import {createApp} from 'vue'
+import App from './App.vue'
+import './style.css';
+
+createApp(App).mount('#app')

widget/looker/frontend/src/style.css

@@ -0,0 +1,26 @@
+html {
+    background-color: rgba(27, 38, 54, 1);
+    text-align: center;
+    color: white;
+}
+
+body {
+    margin: 0;
+    color: white;
+    font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
+    "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
+    sans-serif;
+}
+
+@font-face {
+    font-family: "Nunito";
+    font-style: normal;
+    font-weight: 400;
+    src: local(""),
+    url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
+}
+
+#app {
+    height: 100vh;
+    text-align: center;
+}

widget/looker/frontend/src/vite-env.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+    import type {DefineComponent} from 'vue'
+    const component: DefineComponent<{}, {}, any>
+    export default component
+}