diff --git a/src/vue_project/src/App.vue b/src/vue_project/src/App.vue index 5100c7c..03f7e3c 100644 --- a/src/vue_project/src/App.vue +++ b/src/vue_project/src/App.vue @@ -21,7 +21,6 @@ export default { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #2c3e50; - margin-top: 20px; } body { @@ -29,4 +28,25 @@ body { padding: 0; background-color: #f5f7fa; } + +/* 全局样式 */ +.el-button--primary { + background-color: #0066FF; + border-color: #0066FF; +} + +.el-button--primary:hover, .el-button--primary:focus { + background-color: #1473E6; + border-color: #1473E6; +} + +.el-button--success { + background-color: #66CC33; + border-color: #66CC33; +} + +.el-button--success:hover, .el-button--success:focus { + background-color: #5ab930; + border-color: #5ab930; +} diff --git a/src/vue_project/src/components/MainPage.vue b/src/vue_project/src/components/MainPage.vue index d370380..676adbf 100644 --- a/src/vue_project/src/components/MainPage.vue +++ b/src/vue_project/src/components/MainPage.vue @@ -1,24 +1,370 @@ @@ -32,53 +378,450 @@ export default { }, data() { return { - fileReady: false, + activeStep: 0, fileData: null, - fileType: null + fileType: null, + stepResults: { + 0: false, + 1: false, + 2: false, + 3: false, + 4: false + }, + preprocessSettings: { + removeEmptyLines: true, + standardizeDates: true, + removeSpecialChars: false + }, + mergeSettings: { + targetFormat: 'standard', + mergeSimilarItems: true, + generateUniqueIds: true + }, + spellCheckSettings: { + enabled: true, + grammarCheck: true, + termBase: 'aviation' + }, + analysisSettings: { + model: 'basic', + depth: 3, + dimensions: ['情感分析', '关键信息提取'] + }, + sampleColumns: [ + { prop: 'flightNo', label: '航班号', width: '120' }, + { prop: 'date', label: '日期', width: '120' }, + { prop: 'customerQuery', label: '客户问题', width: '250' }, + { prop: 'agentResponse', label: '客服回复', width: '250' }, + { prop: 'category', label: '问题类别', width: '120' } + ], + sampleData: [ + { + flightNo: 'CA1234', + date: '2023-06-15', + customerQuery: '我的航班什么时候起飞？', + agentResponse: '您好，CA1234航班计划于15:30起飞。', + category: '航班信息' + }, + { + flightNo: 'MU5678', + date: '2023-06-15', + customerQuery: '我的行李还没到，怎么办？', + agentResponse: '很抱歉，我们会立即为您查询行李状态。', + category: '行李问题' + }, + { + flightNo: 'CZ9012', + date: '2023-06-16', + customerQuery: '这个航班延误了，我能改签吗？', + agentResponse: '可以的，我们可以为您免费改签今天的其他航班。', + category: '航班延误' + } + ], + correctionSamples: [ + { original: 'filght', corrected: 'flight', type: '拼写错误', confidence: '98%' }, + { original: 'customar', corrected: 'customer', type: '拼写错误', confidence: '95%' }, + { original: 'dely', corrected: 'delay', type: '拼写错误', confidence: '97%' }, + { original: 'bagage', corrected: 'baggage', type: '拼写错误', confidence: '99%' }, + { original: 'tickit', corrected: 'ticket', type: '拼写错误', confidence: '96%' } + ] }; }, + computed: { + canGoNext() { + return this.stepResults[this.activeStep]; + } + }, methods: { onFileReady(data) { - this.fileReady = true; this.fileData = data.fileData; this.fileType = data.fileType; - this.$message.success('文件已准备好，可以开始处理'); + this.stepResults[0] = true; + this.$message.success('文件准备就绪，可以进行下一步操作'); + }, + nextStep() { + if (this.activeStep < 4 && this.stepResults[this.activeStep]) { + this.activeStep += 1; + } + }, + prevStep() { + if (this.activeStep > 0) { + this.activeStep -= 1; + } + }, + goToStep(step) { + // 只能前往已完成前一步骤的步骤 + if (step === 0 || (step > 0 && this.stepResults[step-1])) { + this.activeStep = step; + + // 如果是前往第一步但尚未上传文件，显示文件上传对话框 + if (step === 0 && !this.stepResults[0]) { + this.openUploadDialog(); + } + + // 如果前往的步骤尚未完成处理，可以自动触发处理 + if (step > 0 && !this.stepResults[step]) { + this.processStep(step); + } + } else { + this.$message.warning('请先完成前一步骤'); + } + }, + processStep(step) { + // 模拟处理过程 + const loadingInstance = this.$loading({ + lock: true, + text: this.getLoadingText(step), + spinner: 'el-icon-loading', + background: 'rgba(0, 0, 0, 0.7)' + }); + + // 模拟处理时间 + setTimeout(() => { + loadingInstance.close(); + this.stepResults[step] = true; + this.$message.success(this.getSuccessMessage(step)); + }, 2000); + }, + getLoadingText(step) { + const texts = { + 1: '正在进行预处理...', + 2: '正在合并格式...', + 3: '正在进行单词纠错...', + 4: '正在进行大模型分析，这可能需要一些时间...' + }; + return texts[step] || '处理中...'; + }, + getSuccessMessage(step) { + const messages = { + 1: '预处理完成！', + 2: '格式合并完成！', + 3: '单词纠错完成！', + 4: '大模型分析完成！' + }; + return messages[step] || '处理完成！'; + }, + exportFinalResults() { + this.$message.success('分析结果已导出为CSV文件'); + }, + openUploadDialog() { + // 这个方法用于在底部步骤中点击"选择文件"按钮时触发上传文件功能 + // 在实际应用中，可能需要调用子组件的方法或显示一个文件选择对话框 } } }; \ No newline at end of file diff --git a/src/vue_project/src/components/features/ConversionProcess.vue b/src/vue_project/src/components/features/ConversionProcess.vue new file mode 100644 index 0000000..e9bed61 --- /dev/null +++ b/src/vue_project/src/components/features/ConversionProcess.vue @@ -0,0 +1,357 @@ + + + + + \ No newline at end of file diff --git a/src/vue_project/src/components/features/ConversionWidget.vue b/src/vue_project/src/components/features/ConversionWidget.vue new file mode 100644 index 0000000..64e4aaa --- /dev/null +++ b/src/vue_project/src/components/features/ConversionWidget.vue @@ -0,0 +1,414 @@ + + + + + \ No newline at end of file diff --git a/src/vue_project/src/components/layout/Header.vue b/src/vue_project/src/components/layout/Header.vue new file mode 100644 index 0000000..355fba9 --- /dev/null +++ b/src/vue_project/src/components/layout/Header.vue @@ -0,0 +1,112 @@ + + + + + \ No newline at end of file