@hlw-zbzs/ai 1.0.1 → 1.0.3

package/src/components/header.vue

@@ -1,98 +0,0 @@
-<template>
-	<div class="ai-header">
-		<div class="header-title">
-			<n-icon :size="18" class="title-icon"><HardwareChipOutline /></n-icon>
-			<span class="title-text">大模型配置与测试</span>
-		</div>
-
-		<div class="header-right">
-			<n-tag
-				:type="ready ? 'success' : 'warning'"
-				size="small"
-				round
-				:bordered="false"
-				class="status-tag"
-			>
-				<template #icon>
-					<n-icon>
-						<CheckmarkCircleOutline v-if="ready" />
-						<AlertCircleOutline v-else />
-					</n-icon>
-				</template>
-				{{ ready ? `${info.name} 已就绪` : `${info.name} 未配 Key` }}
-			</n-tag>
-
-			<div class="switch-wrap">
-				<span class="switch-label">启用 AI:</span>
-				<n-switch :value="enabled" size="small" @update:value="onToggle" />
-			</div>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { HardwareChipOutline, CheckmarkCircleOutline, AlertCircleOutline } from '@vicons/ionicons5'
-import { NIcon, NTag, NSwitch } from 'naive-ui'
-import { toast } from '@hlw-zbzs/vue'
-import { useAi } from '../core'
-
-const { info, ready, enabled } = useAi()
-
-function onToggle(val: boolean) {
-	enabled.value = val
-	toast(`AI 功能已${val ? '开启' : '停用'}`, val ? 'success' : 'info')
-}
-</script>
-
-<style scoped lang="scss">
-.ai-header {
-	height: 48px;
-	background: #ffffff;
-	border-bottom: 1px solid #e2e8f0;
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	padding: 0 16px;
-	flex-shrink: 0;
-
-	.header-title {
-		display: flex;
-		align-items: center;
-		gap: 8px;
-
-		.title-icon {
-			color: #2563eb;
-		}
-
-		.title-text {
-			font-size: 15px;
-			font-weight: 400;
-			color: #0f172a;
-			letter-spacing: 0.5px;
-		}
-	}
-
-	.header-right {
-		display: flex;
-		align-items: center;
-		gap: 14px;
-
-		.status-tag {
-			user-select: none;
-			font-weight: 400;
-		}
-
-		.switch-wrap {
-			display: flex;
-			align-items: center;
-			gap: 6px;
-
-			.switch-label {
-				font-size: 13px;
-				font-weight: 400;
-				color: #475569;
-			}
-		}
-	}
-}
-</style>

package/src/components/index.ts

@@ -1,15 +0,0 @@
-import HlwAi from './ai.vue'
-import AiHeader from './header.vue'
-import AiGrid from './grid.vue'
-import AiParams from './params.vue'
-import AiChat from './chat.vue'
-
-export {
-	HlwAi,
-	AiHeader,
-	AiGrid,
-	AiParams,
-	AiChat
-}
-
-export default HlwAi

package/src/components/params.vue

@@ -1,388 +0,0 @@
-<template>
-	<div class="params-container">
-		<div class="params-fields">
-			<!-- 凭证与连接参数 -->
-			<div class="field-section">
-				<div class="section-header">
-					<span class="section-title">API 凭证与模型</span>
-				</div>
-
-				<div class="form-row">
-					<div class="form-field flex-2">
-						<label class="field-label">
-							<span class="label-title">
-								<span>API Key</span>
-								<span v-if="!info.free" class="req-star">*</span>
-								<span v-else class="free-text">(本地模型无需填写)</span>
-							</span>
-							<a v-if="info.url" class="portal-link" title="在浏览器中打开开发者平台获取 Key" @click.stop="openPortal(info.url)">
-								<span>获取 {{ info.name }} 密钥</span>
-								<n-icon :size="12"><OpenOutline /></n-icon>
-							</a>
-						</label>
-						<n-input
-							:value="conf.key"
-							type="password"
-							show-password-on="click"
-							:placeholder="info.free ? '免密模型' : '请输入 API Key (sk-...)'"
-							size="medium"
-							clearable
-							@update:value="onKeyChange"
-						/>
-					</div>
-
-					<div class="form-field flex-1">
-						<label class="field-label">模型 (Model)</label>
-						<n-select
-							:value="conf.model"
-							:options="modelOptions"
-							tag
-							filterable
-							size="medium"
-							placeholder="选择或输入模型"
-							@update:value="onModelChange"
-						/>
-					</div>
-				</div>
-
-				<div class="form-field">
-					<label class="field-label">接口地址 (Base URL)</label>
-					<n-input
-						:value="conf.url"
-						type="text"
-						placeholder="https://api.openai.com/v1"
-						size="medium"
-						clearable
-						@update:value="onUrlChange"
-					/>
-				</div>
-			</div>
-
-			<!-- 超参数调节 -->
-			<div class="field-section">
-				<div class="section-header">
-					<span class="section-title">生成参数</span>
-				</div>
-
-				<div class="form-row">
-					<div class="form-field flex-1">
-						<label class="field-label">随机温度 (Temperature): {{ conf.temp ?? 0.7 }}</label>
-						<div class="slider-box">
-							<n-slider
-								:value="conf.temp ?? 0.7"
-								:min="0"
-								:max="2"
-								:step="0.05"
-								style="flex: 1;"
-								@update:value="onTempChange"
-							/>
-							<n-input-number
-								:value="conf.temp ?? 0.7"
-								:min="0"
-								:max="2"
-								:step="0.05"
-								size="small"
-								style="width: 76px;"
-								@update:value="onTempChange"
-							/>
-						</div>
-					</div>
-
-					<div class="form-field flex-1">
-						<label class="field-label">最大 Token 数</label>
-						<n-input-number
-							:value="conf.tokens ?? 2048"
-							:min="128"
-							:max="16384"
-							:step="256"
-							size="medium"
-							style="width: 100%;"
-							@update:value="onTokensChange"
-						/>
-					</div>
-				</div>
-
-				<div class="form-field">
-					<label class="field-label">系统人设 (System Prompt)</label>
-					<n-input
-						:value="conf.sys"
-						type="textarea"
-						placeholder="定义 AI 的角色定位与回答风格..."
-						:autosize="{ minRows: 2.5, maxRows: 4.5 }"
-						size="medium"
-						@update:value="onSysChange"
-					/>
-				</div>
-			</div>
-		</div>
-
-		<!-- 左侧底部操作栏 -->
-		<div class="params-footer">
-			<div class="footer-actions">
-				<hlw-button
-					size="medium"
-					type="primary"
-					secondary
-					:loading="testing"
-					:icon="PulseOutline"
-					@click="onTest"
-				>
-					测试连接
-				</hlw-button>
-
-				<hlw-button
-					size="medium"
-					secondary
-					:icon="RefreshOutline"
-					@click="onReset"
-				>
-					恢复默认
-				</hlw-button>
-			</div>
-
-			<n-tag
-				v-if="testResult"
-				:type="testResult.success ? 'success' : 'error'"
-				size="small"
-				round
-				:bordered="false"
-			>
-				<template #icon>
-					<n-icon>
-						<CheckmarkCircleOutline v-if="testResult.success" />
-						<CloseCircleOutline v-else />
-					</n-icon>
-				</template>
-				{{ testResult.success ? `已连通 (${testResult.latency}ms)` : '连接失败' }}
-			</n-tag>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { ref, computed } from 'vue'
-import {
-	PulseOutline,
-	RefreshOutline,
-	CheckmarkCircleOutline,
-	CloseCircleOutline,
-	OpenOutline
-} from '@vicons/ionicons5'
-import { NInput, NSelect, NSlider, NInputNumber, NTag, NIcon } from 'naive-ui'
-import { tools } from '@hlw-zbzs/core'
-import { toast, HlwButton } from '@hlw-zbzs/vue'
-import { useAi } from '../core'
-import type { AiTest } from '../types'
-
-const {
-	engine,
-	conf,
-	info,
-	save,
-	reset,
-	test
-} = useAi()
-
-function openPortal(url?: string) {
-	if (!url) return
-	if (tools?.openExternal) {
-		tools.openExternal(url)
-	} else {
-		window.open(url, '_blank')
-	}
-}
-
-const testing = ref(false)
-const testResult = ref<AiTest | null>(null)
-
-const modelOptions = computed(() => {
-	const models = info.value.models || []
-	return models.map((item) => ({
-		label: item,
-		value: item
-	}))
-})
-
-function onKeyChange(val: string) {
-	save(engine.value, { key: val.trim() })
-}
-
-function onUrlChange(val: string) {
-	save(engine.value, { url: val.trim() })
-}
-
-function onModelChange(val: string) {
-	save(engine.value, { model: val.trim() })
-}
-
-function onTempChange(val: number | null) {
-	if (val !== null && val !== undefined) {
-		save(engine.value, { temp: val })
-	}
-}
-
-function onTokensChange(val: number | null) {
-	if (val) save(engine.value, { tokens: val })
-}
-
-function onSysChange(val: string) {
-	save(engine.value, { sys: val })
-}
-
-async function onTest() {
-	testing.value = true
-	testResult.value = null
-	try {
-		const res = await test()
-		testResult.value = res
-		if (res.success) {
-			toast(`连接成功，耗时 ${res.latency}ms`, 'success')
-		} else {
-			toast(`连接失败: ${res.msg}`, 'error')
-		}
-	} catch (err: any) {
-		testResult.value = {
-			success: false,
-			msg: err?.message || '连接异常',
-			latency: 0
-		}
-		toast(`连接异常: ${err?.message || '未知错误'}`, 'error')
-	} finally {
-		testing.value = false
-	}
-}
-
-function onReset() {
-	reset(engine.value)
-	testResult.value = null
-	toast(`已恢复【${info.value.name}】为默认配置`, 'info')
-}
-
-defineExpose({
-	clearTest: () => {
-		testResult.value = null
-	}
-})
-</script>
-
-<style scoped lang="scss">
-.params-container {
-	display: flex;
-	flex-direction: column;
-	gap: 16px;
-	padding: 16px 16px 0 16px;
-
-	.params-fields {
-		display: flex;
-		flex-direction: column;
-		gap: 16px;
-	}
-
-	.field-section {
-		display: flex;
-		flex-direction: column;
-		gap: 10px;
-
-		.section-header {
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			border-bottom: 1px solid #f1f5f9;
-			padding-bottom: 6px;
-
-			.section-title {
-				font-size: 14px;
-				font-weight: 400;
-				color: #1e293b;
-			}
-		}
-
-		.form-row {
-			display: flex;
-			gap: 12px;
-
-			.flex-1 {
-				flex: 1;
-				min-width: 0;
-			}
-
-			.flex-2 {
-				flex: 2;
-				min-width: 0;
-			}
-		}
-
-		.form-field {
-			display: flex;
-			flex-direction: column;
-			gap: 6px;
-
-			.field-label {
-				font-size: 13px;
-				font-weight: 400;
-				color: #475569;
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-
-				.label-title {
-					display: flex;
-					align-items: center;
-					gap: 4px;
-				}
-
-				.req-star {
-					color: #ef4444;
-				}
-
-				.free-text {
-					color: #059669;
-					font-size: 12px;
-				}
-
-				.portal-link {
-					display: inline-flex;
-					align-items: center;
-					gap: 3px;
-					font-size: 12px;
-					font-weight: 400;
-					color: #2563eb;
-					cursor: pointer;
-					text-decoration: none;
-					transition: all 0.15s ease;
-
-					&:hover {
-						color: #1d4ed8;
-						text-decoration: underline;
-					}
-				}
-			}
-
-			.slider-box {
-				display: flex;
-				align-items: center;
-				gap: 10px;
-			}
-		}
-	}
-
-	.params-footer {
-		height: 54px;
-		margin-top: auto;
-		border-top: 1px solid #e2e8f0;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 0 16px;
-		margin-left: -16px;
-		margin-right: -16px;
-		background: #ffffff;
-
-		.footer-actions {
-			display: flex;
-			align-items: center;
-			gap: 8px;
-		}
-	}
-}
-</style>

package/src/core/index.ts

@@ -1,169 +0,0 @@
-/**
- * @file AI 核心响应式 Hook (单单词极简命名，零冗余代码)
- */
-
-import { computed, ref } from 'vue'
-import { storeToRefs } from 'pinia'
-import { useAiStore } from '../store'
-import { Engine } from '../engines/base'
-import type {
-	AiConfig,
-	AiEngine,
-	AiHandler,
-	AiInfo,
-	AiMsg,
-	AiOption,
-	AiResult,
-	AiTest
-} from '../types'
-
-const engines = new Map<AiEngine, Engine>()
-
-function getEngine(type: AiEngine, conf: AiConfig): Engine {
-	let instance = engines.get(type)
-	if (!instance) {
-		instance = new Engine(type, conf)
-		engines.set(type, instance)
-	} else {
-		instance.save(conf)
-	}
-	return instance
-}
-
-export function useAi() {
-	const store = useAiStore()
-	const { engine, enabled } = storeToRefs(store)
-
-	const loading = ref(false)
-	const text = ref('')
-	const think = ref('')
-	let controller: AbortController | null = null
-
-	const current = computed<Engine>(() => getEngine(store.engine, store.conf))
-	const info = computed<AiInfo>(() => store.info)
-	const conf = computed<AiConfig>(() => store.conf)
-	const ready = computed<boolean>(() => store.ready)
-	const list = computed<AiInfo[]>(() => store.list)
-
-	function select(type: AiEngine) {
-		store.set(type)
-	}
-
-	function abort() {
-		if (controller) {
-			controller.abort()
-			controller = null
-		}
-		loading.value = false
-	}
-
-	async function chat(
-		input: string | AiMsg[],
-		option?: Partial<AiOption>,
-		type?: AiEngine
-	): Promise<string> {
-		if (!enabled.value) throw new Error('AI 功能已停用')
-		loading.value = true
-		text.value = ''
-		think.value = ''
-		controller = new AbortController()
-
-		const target = type ? getEngine(type, store.configs[type] || store.conf) : current.value
-
-		try {
-			const list: AiMsg[] =
-				typeof input === 'string' ? [{ role: 'user', text: input }] : input
-
-			const res: AiResult = await target.chat({
-				list,
-				signal: controller.signal,
-				...option
-			})
-
-			text.value = res.text
-			think.value = res.think || ''
-			return res.text
-		} finally {
-			loading.value = false
-			controller = null
-		}
-	}
-
-	async function stream(
-		input: string | AiMsg[],
-		handler: AiHandler = {},
-		type?: AiEngine
-	): Promise<string> {
-		if (!enabled.value) throw new Error('AI 功能已停用')
-		loading.value = true
-		text.value = ''
-		think.value = ''
-		controller = new AbortController()
-
-		const target = type ? getEngine(type, store.configs[type] || store.conf) : current.value
-
-		try {
-			const list: AiMsg[] =
-				typeof input === 'string' ? [{ role: 'user', text: input }] : input
-
-			const res: AiResult = await target.stream(
-				{
-					list,
-					signal: controller.signal
-				},
-				{
-					onToken: (delta) => {
-						text.value += delta
-						handler.onToken?.(delta)
-					},
-					onThink: (delta) => {
-						think.value += delta
-						handler.onThink?.(delta)
-					},
-					onDone: (fullText, fullThink) => {
-						text.value = fullText
-						think.value = fullThink || ''
-						handler.onDone?.(fullText, fullThink)
-					},
-					onError: (err) => {
-						handler.onError?.(err)
-					}
-				}
-			)
-
-			return res.text
-		} finally {
-			loading.value = false
-			controller = null
-		}
-	}
-
-	async function test(type?: AiEngine, tempConf?: Partial<AiConfig>): Promise<AiTest> {
-		const targetType = type || store.engine
-		const targetConf = store.configs[targetType] || store.conf
-		const target = getEngine(targetType, targetConf)
-		return target.test(tempConf)
-	}
-
-	return {
-		store,
-		engine,
-		enabled,
-		conf,
-		info,
-		list,
-		ready,
-		loading: computed(() => loading.value),
-		text: computed(() => text.value),
-		think: computed(() => think.value),
-		select,
-		chat,
-		stream,
-		test,
-		abort,
-		save: store.save.bind(store),
-		reset: store.reset.bind(store)
-	}
-}
-
-export default useAi