前端增加专家模式提示词
This commit is contained in:
Binary file not shown.
@@ -1373,6 +1373,529 @@
|
||||
}
|
||||
```
|
||||
|
||||
### 区块链场景
|
||||
|
||||
#### 1. 智能合约开发模板
|
||||
```json
|
||||
{
|
||||
"input_text": "开发一个NFT交易平台的智能合约系统",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "区块链",
|
||||
"key_requirements": [
|
||||
"合约功能",
|
||||
"安全机制",
|
||||
"交易流程"
|
||||
],
|
||||
"expected_output": "智能合约设计方案",
|
||||
"constraints": [
|
||||
"Gas优化",
|
||||
"安全审计",
|
||||
"兼容性要求"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. DeFi项目模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计一个去中心化借贷平台的核心机制",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "DeFi",
|
||||
"key_requirements": [
|
||||
"流动性池",
|
||||
"利率模型",
|
||||
"风险控制"
|
||||
],
|
||||
"expected_output": "DeFi协议设计方案",
|
||||
"constraints": [
|
||||
"资金安全",
|
||||
"市场风险",
|
||||
"治理机制"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 元宇宙场景
|
||||
|
||||
#### 1. 虚拟世界设计模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计一个教育类元宇宙虚拟校园",
|
||||
"template": {
|
||||
"core_intent": "创意",
|
||||
"domain": "元宇宙",
|
||||
"key_requirements": [
|
||||
"空间设计",
|
||||
"互动机制",
|
||||
"社交系统"
|
||||
],
|
||||
"expected_output": "虚拟世界设计方案",
|
||||
"constraints": [
|
||||
"性能优化",
|
||||
"沉浸体验",
|
||||
"可扩展性"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 数字资产创作模板
|
||||
```json
|
||||
{
|
||||
"input_text": "创建一系列可用于元宇宙的数字时装",
|
||||
"template": {
|
||||
"core_intent": "创意",
|
||||
"domain": "数字资产",
|
||||
"key_requirements": [
|
||||
"视觉设计",
|
||||
"适配规范",
|
||||
"材质效果"
|
||||
],
|
||||
"expected_output": "数字资产设计方案",
|
||||
"constraints": [
|
||||
"文件格式",
|
||||
"渲染效率",
|
||||
"跨平台兼容"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 网络安全场景
|
||||
|
||||
#### 1. 安全审计模板
|
||||
```json
|
||||
{
|
||||
"input_text": "对企业核心系统进行全面的安全审计",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "安全审计",
|
||||
"key_requirements": [
|
||||
"漏洞扫描",
|
||||
"风险评估",
|
||||
"加固方案"
|
||||
],
|
||||
"expected_output": "安全审计报告",
|
||||
"constraints": [
|
||||
"合规要求",
|
||||
"业务连续性",
|
||||
"修复优先级"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 应急响应模板
|
||||
```json
|
||||
{
|
||||
"input_text": "制定企业网络安全事件应急响应预案",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "应急响应",
|
||||
"key_requirements": [
|
||||
"响应流程",
|
||||
"恢复方案",
|
||||
"追踪溯源"
|
||||
],
|
||||
"expected_output": "应急预案文档",
|
||||
"constraints": [
|
||||
"响应时效",
|
||||
"损失控制",
|
||||
"取证要求"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 数字孪生场景
|
||||
|
||||
#### 1. 工业孪生模板
|
||||
```json
|
||||
{
|
||||
"input_text": "构建工厂生产线的数字孪生系统",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "数字孪生",
|
||||
"key_requirements": [
|
||||
"模型构建",
|
||||
"数据同步",
|
||||
"实时监控"
|
||||
],
|
||||
"expected_output": "数字孪生系统方案",
|
||||
"constraints": [
|
||||
"精度要求",
|
||||
"实时性能",
|
||||
"可视化效果"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 城市孪生模板
|
||||
```json
|
||||
{
|
||||
"input_text": "开发城市级别的数字孪生平台",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "城市孪生",
|
||||
"key_requirements": [
|
||||
"空间建模",
|
||||
"数据集成",
|
||||
"场景应用"
|
||||
],
|
||||
"expected_output": "平台架构方案",
|
||||
"constraints": [
|
||||
"数据规模",
|
||||
"更新机制",
|
||||
"互操作性"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 数据治理场景
|
||||
|
||||
#### 1. 数据质量管理模板
|
||||
```json
|
||||
{
|
||||
"input_text": "建立企业级数据质量管理体系",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "数据治理",
|
||||
"key_requirements": [
|
||||
"质量标准",
|
||||
"监控指标",
|
||||
"清洗规则"
|
||||
],
|
||||
"expected_output": "数据治理方案",
|
||||
"constraints": [
|
||||
"业务规则",
|
||||
"实时监控",
|
||||
"成本效益"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 主数据管理模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计客户主数据管理系统",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "主数据",
|
||||
"key_requirements": [
|
||||
"数据模型",
|
||||
"同步机制",
|
||||
"版本控制"
|
||||
],
|
||||
"expected_output": "MDM系统方案",
|
||||
"constraints": [
|
||||
"数据一致性",
|
||||
"系统集成",
|
||||
"权限管理"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 云原生场景
|
||||
|
||||
#### 1. 微服务架构模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计电商系统的微服务架构",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "微服务",
|
||||
"key_requirements": [
|
||||
"服务拆分",
|
||||
"接口设计",
|
||||
"部署策略"
|
||||
],
|
||||
"expected_output": "架构设计文档",
|
||||
"constraints": [
|
||||
"服务解耦",
|
||||
"性能要求",
|
||||
"可维护性"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 容器编排模板
|
||||
```json
|
||||
{
|
||||
"input_text": "规划大规模容器集群的自动化运维方案",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "容器编排",
|
||||
"key_requirements": [
|
||||
"资源调度",
|
||||
"服务发现",
|
||||
"监控告警"
|
||||
],
|
||||
"expected_output": "运维方案",
|
||||
"constraints": [
|
||||
"高可用性",
|
||||
"扩展性能",
|
||||
"故障恢复"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 低代码开发场景
|
||||
|
||||
#### 1. 业务应用开发模板
|
||||
```json
|
||||
{
|
||||
"input_text": "使用低代码平台开发企业OA系统",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "低代码开发",
|
||||
"key_requirements": [
|
||||
"流程设计",
|
||||
"表单配置",
|
||||
"权限管理"
|
||||
],
|
||||
"expected_output": "应用开发方案",
|
||||
"constraints": [
|
||||
"可配置性",
|
||||
"性能要求",
|
||||
"用户体验"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 集成开发模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计低代码平台与现有系统的集成方案",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "系统集成",
|
||||
"key_requirements": [
|
||||
"接口适配",
|
||||
"数据同步",
|
||||
"安全控制"
|
||||
],
|
||||
"expected_output": "集成方案",
|
||||
"constraints": [
|
||||
"兼容性",
|
||||
"实时性能",
|
||||
"维护成本"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 边缘计算场景
|
||||
|
||||
#### 1. 边缘智能模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计工业现场的边缘计算解决方案",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "边缘计算",
|
||||
"key_requirements": [
|
||||
"数据处理",
|
||||
"实时分析",
|
||||
"本地决策"
|
||||
],
|
||||
"expected_output": "边缘计算方案",
|
||||
"constraints": [
|
||||
"延迟要求",
|
||||
"资源限制",
|
||||
"网络带宽"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 边云协同模板
|
||||
```json
|
||||
{
|
||||
"input_text": "构建边缘计算与云端协同的智能系统",
|
||||
"template": {
|
||||
"core_intent": "技术",
|
||||
"domain": "边云协同",
|
||||
"key_requirements": [
|
||||
"任务调度",
|
||||
"数据分发",
|
||||
"协同控制"
|
||||
],
|
||||
"expected_output": "协同系统方案",
|
||||
"constraints": [
|
||||
"网络质量",
|
||||
"计算效率",
|
||||
"安全防护"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 数字营销场景
|
||||
|
||||
#### 1. 社交媒体营销模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计一个跨平台社交媒体营销活动方案",
|
||||
"template": {
|
||||
"core_intent": "营销",
|
||||
"domain": "社交媒体",
|
||||
"key_requirements": [
|
||||
"内容策划",
|
||||
"平台选择",
|
||||
"互动机制"
|
||||
],
|
||||
"expected_output": "营销活动方案",
|
||||
"constraints": [
|
||||
"品牌一致性",
|
||||
"平台特性",
|
||||
"ROI要求"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 精准广告投放模板
|
||||
```json
|
||||
{
|
||||
"input_text": "制定基于用户画像的精准广告投放策略",
|
||||
"template": {
|
||||
"core_intent": "营销",
|
||||
"domain": "广告投放",
|
||||
"key_requirements": [
|
||||
"用户分群",
|
||||
"投放策略",
|
||||
"效果追踪"
|
||||
],
|
||||
"expected_output": "广告投放方案",
|
||||
"constraints": [
|
||||
"预算控制",
|
||||
"转化目标",
|
||||
"隐私合规"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 智能制造场景
|
||||
|
||||
#### 1. 智能工厂规划模板
|
||||
```json
|
||||
{
|
||||
"input_text": "规划一个智能工厂的数字化转型方案",
|
||||
"template": {
|
||||
"core_intent": "制造",
|
||||
"domain": "智能工厂",
|
||||
"key_requirements": [
|
||||
"生产自动化",
|
||||
"数据集成",
|
||||
"智能调度"
|
||||
],
|
||||
"expected_output": "工厂规划方案",
|
||||
"constraints": [
|
||||
"投资回报",
|
||||
"实施周期",
|
||||
"人员培训"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 柔性制造模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计一个柔性生产线的智能调度系统",
|
||||
"template": {
|
||||
"core_intent": "制造",
|
||||
"domain": "柔性制造",
|
||||
"key_requirements": [
|
||||
"产线配置",
|
||||
"调度算法",
|
||||
"切换策略"
|
||||
],
|
||||
"expected_output": "调度系统方案",
|
||||
"constraints": [
|
||||
"切换效率",
|
||||
"产能平衡",
|
||||
"质量保证"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 供应链管理场景
|
||||
|
||||
#### 1. 智能仓储模板
|
||||
```json
|
||||
{
|
||||
"input_text": "设计智能仓储管理系统的优化方案",
|
||||
"template": {
|
||||
"core_intent": "物流",
|
||||
"domain": "仓储管理",
|
||||
"key_requirements": [
|
||||
"库位优化",
|
||||
"拣选策略",
|
||||
"库存预测"
|
||||
],
|
||||
"expected_output": "仓储优化方案",
|
||||
"constraints": [
|
||||
"空间利用",
|
||||
"作业效率",
|
||||
"准确度要求"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. 供应链优化模板
|
||||
```json
|
||||
{
|
||||
"input_text": "构建供应链网络优化和风险管理系统",
|
||||
"template": {
|
||||
"core_intent": "物流",
|
||||
"domain": "供应链优化",
|
||||
"key_requirements": [
|
||||
"网络规划",
|
||||
"风险评估",
|
||||
"成本优化"
|
||||
],
|
||||
"expected_output": "供应链优化方案",
|
||||
"constraints": [
|
||||
"服务水平",
|
||||
"库存成本",
|
||||
"响应时间"
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 使用建议更新
|
||||
|
||||
19. **数据驱动决策**
|
||||
- 重视数据分析
|
||||
- 建立评估指标
|
||||
- 持续优化改进
|
||||
|
||||
20. **跨平台适配**
|
||||
- 考虑多平台兼容
|
||||
- 统一用户体验
|
||||
- 优化资源利用
|
||||
|
||||
21. **风险管理**
|
||||
- 识别潜在风险
|
||||
- 制定应对策略
|
||||
- 建立监控机制
|
||||
|
||||
### 使用建议
|
||||
|
||||
1. **选择合适模板**
|
||||
@@ -1437,3 +1960,33 @@
|
||||
- 鼓励创新思维
|
||||
- 保持开放性思考
|
||||
- 注重实用价值
|
||||
|
||||
13. **新技术应用**
|
||||
- 关注前沿技术发展
|
||||
- 结合传统领域创新
|
||||
- 注重实践可行性
|
||||
|
||||
14. **安全合规**
|
||||
- 遵守行业规范
|
||||
- 注意数据安全
|
||||
- 考虑隐私保护
|
||||
|
||||
15. **性能优化**
|
||||
- 关注系统效率
|
||||
- 优化资源使用
|
||||
- 提升用户体验
|
||||
|
||||
16. **架构设计**
|
||||
- 注重系统可扩展性
|
||||
- 考虑技术演进路径
|
||||
- 平衡成本与收益
|
||||
|
||||
17. **集成策略**
|
||||
- 关注系统互操作性
|
||||
- 制定数据交换标准
|
||||
- 确保安全可控
|
||||
|
||||
18. **运维支持**
|
||||
- 完善监控体系
|
||||
- 建立应急机制
|
||||
- 优化运维流程
|
||||
@@ -1169,4 +1169,9 @@ def wx_generate_expert_prompt():
|
||||
'data': None
|
||||
})
|
||||
|
||||
@main_bp.route('/expert_generate')
|
||||
def expert_generate():
|
||||
"""专家提示词生成页面"""
|
||||
return render_template('expert_generate.html')
|
||||
|
||||
# ... 其他路由保持不变，但要把 @app 改成 @main_bp ...
|
||||
250
flask_prompt_master/templates/expert_generate.html
Normal file
250
flask_prompt_master/templates/expert_generate.html
Normal file
@@ -0,0 +1,250 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container mt-4">
|
||||
<div class="row">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h2>专家提示词生成器</h2>
|
||||
<a href="{{ url_for('main.index') }}" class="btn btn-outline-primary">
|
||||
<i class="fas fa-arrow-left"></i> 返回基础模式
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<form id="expertPromptForm">
|
||||
<div class="mb-3">
|
||||
<label for="input_text" class="form-label">请描述您的需求</label>
|
||||
<textarea class="form-control" id="input_text" name="input_text" rows="4" required></textarea>
|
||||
<div class="form-text">详细描述您的需求，系统将进行专业分析并生成高质量提示词</div>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary" id="generateBtn">
|
||||
<i class="fas fa-magic"></i> 生成专家提示词
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loadingIndicator" class="text-center mt-4 d-none">
|
||||
<div class="spinner-border text-primary" role="status">
|
||||
<span class="visually-hidden">生成中...</span>
|
||||
</div>
|
||||
<p class="mt-2">正在分析需求并生成专业提示词...</p>
|
||||
</div>
|
||||
|
||||
<div id="resultCard" class="card mt-4 d-none">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title mb-4">生成结果</h5>
|
||||
|
||||
<div class="mb-4">
|
||||
<h6 class="mb-3">需求分析</h6>
|
||||
<div id="intentAnalysis" class="border rounded p-3 bg-light">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p><strong>核心意图：</strong><span id="coreIntent"></span></p>
|
||||
<p><strong>专业领域：</strong><span id="domain"></span></p>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<p><strong>预期输出：</strong><span id="expectedOutput"></span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<p><strong>关键需求：</strong></p>
|
||||
<ul id="keyRequirements" class="mb-0"></ul>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<p><strong>约束条件：</strong></p>
|
||||
<ul id="constraints" class="mb-0"></ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h6 class="mb-3">生成的专家提示词</h6>
|
||||
<div id="generatedPrompt" class="border rounded p-3"></div>
|
||||
<div class="mt-3">
|
||||
<button class="btn btn-sm btn-primary copy-btn" data-target="generatedPrompt">
|
||||
<i class="fas fa-copy"></i> 复制提示词
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% block scripts %}
|
||||
<script>
|
||||
document.getElementById('expertPromptForm').addEventListener('submit', async function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const input_text = document.getElementById('input_text').value;
|
||||
const loadingIndicator = document.getElementById('loadingIndicator');
|
||||
const resultCard = document.getElementById('resultCard');
|
||||
const generateBtn = document.getElementById('generateBtn');
|
||||
|
||||
// 显示加载指示器
|
||||
loadingIndicator.classList.remove('d-none');
|
||||
generateBtn.disabled = true;
|
||||
resultCard.classList.add('d-none');
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/wx/generate/expert', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
input_text: input_text,
|
||||
uid: '12345' // 这里应该使用实际的用户ID
|
||||
})
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.code === 200) {
|
||||
// 更新意图分析结果
|
||||
document.getElementById('coreIntent').textContent = data.data.intent_analysis.core_intent;
|
||||
document.getElementById('domain').textContent = data.data.intent_analysis.domain;
|
||||
document.getElementById('expectedOutput').textContent = data.data.intent_analysis.expected_output;
|
||||
|
||||
// 更新关键需求列表
|
||||
const keyRequirementsList = document.getElementById('keyRequirements');
|
||||
keyRequirementsList.innerHTML = data.data.intent_analysis.key_requirements
|
||||
.map(req => `<li>${req}</li>`).join('');
|
||||
|
||||
// 更新约束条件列表
|
||||
const constraintsList = document.getElementById('constraints');
|
||||
constraintsList.innerHTML = data.data.intent_analysis.constraints
|
||||
.map(constraint => `<li>${constraint}</li>`).join('');
|
||||
|
||||
// 更新生成的提示词
|
||||
document.getElementById('generatedPrompt').textContent = data.data.generated_prompt;
|
||||
|
||||
// 显示结果卡片
|
||||
resultCard.classList.remove('d-none');
|
||||
} else {
|
||||
alert('生成失败：' + data.message);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error:', error);
|
||||
alert('请求失败，请稍后重试');
|
||||
} finally {
|
||||
// 隐藏加载指示器并启用按钮
|
||||
loadingIndicator.classList.add('d-none');
|
||||
generateBtn.disabled = false;
|
||||
}
|
||||
});
|
||||
|
||||
// 改进的复制功能实现
|
||||
function copyToClipboard(text) {
|
||||
// 创建临时文本区域
|
||||
const textArea = document.createElement('textarea');
|
||||
textArea.value = text;
|
||||
document.body.appendChild(textArea);
|
||||
|
||||
try {
|
||||
// 选择文本
|
||||
textArea.select();
|
||||
textArea.setSelectionRange(0, 99999); // 对于移动设备
|
||||
|
||||
// 尝试使用新的 API
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
// 对于现代浏览器
|
||||
navigator.clipboard.writeText(text).then(() => {
|
||||
showCopySuccess();
|
||||
}).catch(err => {
|
||||
console.error('复制失败:', err);
|
||||
// 回退到传统方法
|
||||
document.execCommand('copy');
|
||||
showCopySuccess();
|
||||
});
|
||||
} else {
|
||||
// 对于不支持 Clipboard API 的浏览器
|
||||
const successful = document.execCommand('copy');
|
||||
if (successful) {
|
||||
showCopySuccess();
|
||||
} else {
|
||||
console.error('复制失败');
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('复制出错:', err);
|
||||
} finally {
|
||||
// 清理临时元素
|
||||
document.body.removeChild(textArea);
|
||||
}
|
||||
}
|
||||
|
||||
// 显示复制成功的反馈
|
||||
function showCopySuccess() {
|
||||
const copyBtn = document.querySelector('.copy-btn');
|
||||
const originalHtml = copyBtn.innerHTML;
|
||||
copyBtn.innerHTML = '<i class="fas fa-check"></i> 已复制';
|
||||
copyBtn.classList.add('copied');
|
||||
|
||||
setTimeout(() => {
|
||||
copyBtn.innerHTML = originalHtml;
|
||||
copyBtn.classList.remove('copied');
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
// 绑定复制按钮点击事件
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const copyBtn = document.querySelector('.copy-btn');
|
||||
copyBtn.addEventListener('click', function() {
|
||||
const targetId = this.dataset.target;
|
||||
const text = document.getElementById(targetId).textContent;
|
||||
copyToClipboard(text);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 添加复制按钮样式 */
|
||||
.copy-btn {
|
||||
padding: 8px 16px;
|
||||
background-color: #4a90e2;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.copy-btn:hover {
|
||||
background-color: #357abd;
|
||||
}
|
||||
|
||||
.copy-btn.copied {
|
||||
background-color: #45a049;
|
||||
}
|
||||
|
||||
.copy-btn i {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
/* 生成的提示词样式 */
|
||||
#generatedPrompt {
|
||||
background-color: #f8f9fa;
|
||||
padding: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
white-space: pre-wrap;
|
||||
font-family: monospace;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
/* 加载指示器样式 */
|
||||
#loadingIndicator {
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.spinner-border {
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
@@ -11,135 +11,145 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="main-container">
|
||||
<form method="POST" class="generate-form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
<div class="search-section">
|
||||
<div class="search-box">
|
||||
<input type="text" id="templateSearch" class="search-input" placeholder="搜索模板名称或描述...">
|
||||
<i class="fas fa-search search-icon"></i>
|
||||
<div class="container mt-4">
|
||||
<div class="row">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h2>提示词生成器</h2>
|
||||
<a href="{{ url_for('main.expert_generate') }}" class="btn btn-primary">
|
||||
<i class="fas fa-brain"></i> 专家模式
|
||||
</a>
|
||||
</div>
|
||||
<div class="search-stats">
|
||||
<span class="search-count"></span>
|
||||
</div>
|
||||
</div>
|
||||
<form method="POST" class="generate-form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
<div class="templates-section">
|
||||
<div class="section-header">
|
||||
<h2>选择场景</h2>
|
||||
<div class="filter-controls">
|
||||
<select id="industryFilter" class="custom-select">
|
||||
<option value="all">全部行业</option>
|
||||
{% for industry in industries %}
|
||||
<option value="{{ industry }}">{{ industry }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select id="professionFilter" class="custom-select">
|
||||
<option value="all">全部职业</option>
|
||||
{% for profession in professions %}
|
||||
<option value="{{ profession }}">{{ profession }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select id="subCategoryFilter" class="custom-select">
|
||||
<option value="all">全部领域</option>
|
||||
{% for sub_category in sub_categories %}
|
||||
<option value="{{ sub_category }}">{{ sub_category }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<div class="search-section">
|
||||
<div class="search-box">
|
||||
<input type="text" id="templateSearch" class="search-input" placeholder="搜索模板名称或描述...">
|
||||
<i class="fas fa-search search-icon"></i>
|
||||
</div>
|
||||
<div class="search-stats">
|
||||
<span class="search-count"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="category-tabs">
|
||||
<div class="tab active" data-category="all">全部</div>
|
||||
{% for category in categories %}
|
||||
<div class="tab" data-category="{{ category }}">{{ category }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="templates-section">
|
||||
<div class="section-header">
|
||||
<h2>选择场景</h2>
|
||||
<div class="filter-controls">
|
||||
<select id="industryFilter" class="custom-select">
|
||||
<option value="all">全部行业</option>
|
||||
{% for industry in industries %}
|
||||
<option value="{{ industry }}">{{ industry }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select id="professionFilter" class="custom-select">
|
||||
<option value="all">全部职业</option>
|
||||
{% for profession in professions %}
|
||||
<option value="{{ profession }}">{{ profession }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select id="subCategoryFilter" class="custom-select">
|
||||
<option value="all">全部领域</option>
|
||||
{% for sub_category in sub_categories %}
|
||||
<option value="{{ sub_category }}">{{ sub_category }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="template-grid">
|
||||
{% for template in templates %}
|
||||
<div class="template-card"
|
||||
data-category="{{ template.category }}"
|
||||
data-industry="{{ template.industry }}"
|
||||
data-profession="{{ template.profession }}"
|
||||
data-subcategory="{{ template.sub_category }}">
|
||||
<input type="radio" name="template_id" id="template_{{ template.id }}"
|
||||
value="{{ template.id }}"
|
||||
{% if template.is_default %}checked{% endif %}>
|
||||
<label for="template_{{ template.id }}" class="template-content">
|
||||
<div class="template-actions">
|
||||
<button type="button" class="btn-delete"
|
||||
data-template-id="{{ template.id }}"
|
||||
title="删除模板">
|
||||
<i class="fas fa-trash-alt"></i>
|
||||
<div class="category-tabs">
|
||||
<div class="tab active" data-category="all">全部</div>
|
||||
{% for category in categories %}
|
||||
<div class="tab" data-category="{{ category }}">{{ category }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="template-grid">
|
||||
{% for template in templates %}
|
||||
<div class="template-card"
|
||||
data-category="{{ template.category }}"
|
||||
data-industry="{{ template.industry }}"
|
||||
data-profession="{{ template.profession }}"
|
||||
data-subcategory="{{ template.sub_category }}">
|
||||
<input type="radio" name="template_id" id="template_{{ template.id }}"
|
||||
value="{{ template.id }}"
|
||||
{% if template.is_default %}checked{% endif %}>
|
||||
<label for="template_{{ template.id }}" class="template-content">
|
||||
<div class="template-actions">
|
||||
<button type="button" class="btn-delete"
|
||||
data-template-id="{{ template.id }}"
|
||||
title="删除模板">
|
||||
<i class="fas fa-trash-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="template-categories">
|
||||
<div class="category-group">
|
||||
<span class="category-label">行业:</span>
|
||||
<span class="category-value">{{ template.industry }}</span>
|
||||
</div>
|
||||
<div class="category-group">
|
||||
<span class="category-label">职业:</span>
|
||||
<span class="category-value">{{ template.profession }}</span>
|
||||
</div>
|
||||
<div class="category-group">
|
||||
<span class="category-label">领域:</span>
|
||||
<span class="category-value">{{ template.sub_category }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="template-header">
|
||||
<div class="template-icon">
|
||||
<i class="fas {{ get_template_icon(template.category) }}"></i>
|
||||
</div>
|
||||
<h3>{{ template.name }}</h3>
|
||||
</div>
|
||||
|
||||
<div class="template-info">
|
||||
<p>{{ template.description }}</p>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="input-section">
|
||||
<div class="section-header">
|
||||
<h2>输入需求</h2>
|
||||
<span class="subtitle">描述越详细，生成的提示词效果越好</span>
|
||||
</div>
|
||||
{{ form.input_text(class="form-control custom-textarea", rows=5,
|
||||
placeholder="请详细描述您的需求...") }}
|
||||
</div>
|
||||
|
||||
<div class="action-section">
|
||||
{{ form.submit(class="btn btn-primary btn-generate", value="生成专业提示词") }}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{% if prompt %}
|
||||
<div class="result-section">
|
||||
<div class="result-card">
|
||||
<div class="result-header">
|
||||
<h2>生成结果</h2>
|
||||
<div class="result-actions">
|
||||
<button class="btn btn-copy" onclick="copyText('{{ prompt.generated_text }}')">
|
||||
<i class="fas fa-copy"></i>
|
||||
复制提示词
|
||||
</button>
|
||||
</div>
|
||||
<div class="template-categories">
|
||||
<div class="category-group">
|
||||
<span class="category-label">行业:</span>
|
||||
<span class="category-value">{{ template.industry }}</span>
|
||||
</div>
|
||||
<div class="category-group">
|
||||
<span class="category-label">职业:</span>
|
||||
<span class="category-value">{{ template.profession }}</span>
|
||||
</div>
|
||||
<div class="category-group">
|
||||
<span class="category-label">领域:</span>
|
||||
<span class="category-value">{{ template.sub_category }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="result-content">
|
||||
<div class="output-preview">
|
||||
<div class="text-content">{{ prompt.generated_text }}</div>
|
||||
</div>
|
||||
|
||||
<div class="template-header">
|
||||
<div class="template-icon">
|
||||
<i class="fas {{ get_template_icon(template.category) }}"></i>
|
||||
</div>
|
||||
<h3>{{ template.name }}</h3>
|
||||
</div>
|
||||
|
||||
<div class="template-info">
|
||||
<p>{{ template.description }}</p>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="input-section">
|
||||
<div class="section-header">
|
||||
<h2>输入需求</h2>
|
||||
<span class="subtitle">描述越详细，生成的提示词效果越好</span>
|
||||
</div>
|
||||
{{ form.input_text(class="form-control custom-textarea", rows=5,
|
||||
placeholder="请详细描述您的需求...") }}
|
||||
</div>
|
||||
|
||||
<div class="action-section">
|
||||
{{ form.submit(class="btn btn-primary btn-generate", value="生成专业提示词") }}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{% if prompt %}
|
||||
<div class="result-section">
|
||||
<div class="result-card">
|
||||
<div class="result-header">
|
||||
<h2>生成结果</h2>
|
||||
<div class="result-actions">
|
||||
<button class="btn btn-copy" onclick="copyText('{{ prompt.generated_text }}')">
|
||||
<i class="fas fa-copy"></i>
|
||||
复制提示词
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="result-content">
|
||||
<div class="output-preview">
|
||||
<div class="text-content">{{ prompt.generated_text }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="filter-stats">
|
||||
|
||||
Reference in New Issue
Block a user