fix

virgo.wzfrontend/aiChat/src/components/AIFlowChat.vue

@@ -125,6 +125,7 @@
 			str = data;
 		}
 		let obj = str.split('<workark>');
+		console.log(obj);
 		let newData = obj.map(node => {
 			try {
 				return JSON.parse(node)
@@ -256,12 +257,8 @@
 			renderer
 		});
 	};
-	const AIClick = (e) => {
-		let target = e.target;
-		if (target.className === 'version-href') {
-			let href = target.id;
-			emits('updateURL', href);
-		}
+	const AIClick = (url) => {
+		emits('updateURL', url);
 	}
 	const selectVisible = ref(false);
 	const functionList = ref(['登录功能']);
@@ -273,36 +270,16 @@
 	onUnmounted(() => {
 		stopTimer()
 	})
-	const activities = ref([]);
-	// {
-	// 	title: '现在我将开始创建项目',
-	// 	type: 'success',
-	// 	icon: Check,
-	// 	content: '项目创建成功',
-	// 	describe: '项目名:text-project01'
-	// }, {
-	// 	title: '开始创建首页',
-	// 	type: 'success',
-	// 	icon: Check,
-	// 	content: '页面创建成功',
-	// 	describe: '/app/index/page.jsx'
-	// }, {
-	// 	title: '开始创建关于我们',
-	// 	type: 'success',
-	// 	icon: Check,
-	// 	content: '页面创建成功',
-	// 	describe: '/app/about/page.jsx'
-	// }, {
-	// 	title: '开始创建联系我们',
-	// 	type: 'success',
-	// 	icon: Check,
-	// 	content: '页面创建成功',
-	// 	describe: '/app/tell/page.jsx'
-	// }, {
-	// 	title: '创建项目',
-	// 	type: 'warning',
-	// 	icon: Loading,
-	// }
+	const showLine = (type, item, list) => {
+		let arr = list.filter(node => node.type === 'step');
+		let index = arr.findIndex(node => node.id === item.id);
+		if (type === 'top') {
+			if (index <= 0) return false;
+		} else {
+			if (index >= arr.length - 1) return false;
+		}
+		return true;
+	}
 </script>
 <template>
 	<div class="ai-chat-container">
@@ -327,32 +304,37 @@
 								<div class="wk-markdown wk-query" v-if="item.type === 'markdown'"
 									v-html="renderMarkdown(item.label)">
 								</div>
-								<div class="wk-step" v-if="item.type === 'step'">
-									<el-timeline class="wk-timeline">
-										<el-timeline-item :class="'timeline-'+item.type"
-											:icon="item.status === 'success' ? Check:Loading" :type="item.status"
-											size="large">
-											<div class="wk-content">
-												<div class="title">{{ item.label }}</div>
-												<div class="content">
-													<el-icon>
-														<Monitor />
-													</el-icon>
-													<span class="content-label">{{ item.label }}</span>
-													<span class="content-describe">{{ item.describe }}</span>
-												</div>
-											</div>
-										</el-timeline-item>
-									</el-timeline>
+								<div :class="'wk-step timeline-'+item.type" v-if="item.type === 'step'">
+									<div :class="'step-icon ' + item.status">
+										<el-icon>
+											<Check v-if="item.status === 'success'" />
+											<Loading v-else />
+										</el-icon>
+									</div>
+									<div class="wk-content">
+										<div class="title">{{ item.label }}</div>
+										<div class="content">
+											<el-icon>
+												<Monitor />
+											</el-icon>
+											<span class="content-label">{{ item.label }}</span>
+											<span class="content-describe">{{ item.describe }}</span>
+										</div>
+									</div>
+									<div class="line line-top" v-if="showLine('top',item,message.AIoutputs)"></div>
+									<div class="line line-bottom" v-if="showLine('bottom',item,message.AIoutputs)">
+									</div>
+								</div>
+								<div class="wk-url" v-if="item.type === 'url'">
+									<div class="label">网站生成成功</div>
+									<el-button size="small" type="primary" @click="AIClick(item.url)">点击查看</el-button>
 								</div>
 							</div>
 						</div>
-						<!-- <div class="ai-website-boxs" @click="AIClick" v-html="message.AIoutputs"></div> -->
-
-						<el-button size="small" @click="reloadMessage(message.query)" :disabled="loading"
+						<!-- <el-button size="small" @click="reloadMessage(message.query)" :disabled="loading"
 							style="margin-top: 10px;" v-if="message.AIoutputs.indexOf('系统繁忙，请重试')>-1">
 							点击重试
-						</el-button>
+						</el-button> -->
 					</div>
 				</div>
 			</div>
@@ -429,15 +411,10 @@
 		margin-top: 5px;
 	}
 
-	.timeline-warning {
-		.el-timeline-item__icon {
-			animation: rotating 2s linear infinite;
-		}
-	}
-
 	.wk-query {
 		padding: 12px 0;
 		font-size: 15px;
+		font-weight: 500;
 
 		&:last-child {
 			padding-bottom: 0;
@@ -446,6 +423,62 @@
 
 	.wk-step {
 		padding-top: 15px;
+		padding-left: 20px;
+		position: relative;
+
+		.line {
+			position: absolute;
+			width: 1px;
+			border-left: 1px dashed var(--el-border-color);
+			left: 7px;
+			z-index: 4;
+		}
+
+		.line-top {
+			top: 0;
+			height: 17px;
+		}
+
+		.line-bottom {
+			top: 20px;
+			bottom: 0;
+		}
+
+		.step-icon {
+			position: absolute;
+			left: 0;
+			background: var(--el-color-warning);
+			color: #fff;
+			width: 14px;
+			height: 14px;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			font-size: 12px;
+			border-radius: 16px;
+			top: 18px;
+			z-index: 9;
+
+			&.success {
+				background: var(--el-color-success);
+			}
+		}
+
+		.timeline-warning {
+			.el-timeline-item__icon {
+				animation: rotating 2s linear infinite;
+			}
+		}
+	}
+
+	.wk-url {
+		padding-top: 15px;
+
+		.label {
+			font-size: 15px;
+			font-weight: 500;
+			margin-bottom: 10px;
+		}
 	}
 
 	.wk-timeline {
@@ -460,7 +493,6 @@
 
 	.wk-content {
 		.title {
-			font-size: 15px;
 			color: #222;
 		}
 

virgo.wzfrontend/src/main/resources/static/ai/index.html

@@ -5,8 +5,8 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<link rel="icon" href="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/f9617c7f80da485cb3cc72b6accc62ed">
 		<title>WorkArk AI</title>
-		<script type="module" crossorigin src="./assets/index-DlcYgKdq.js"></script>
-		<link rel="stylesheet" crossorigin href="./assets/index-CUQoNxIj.css">
+		<script type="module" crossorigin src="./assets/index-B8RoiJBX.js"></script>
+		<link rel="stylesheet" crossorigin href="./assets/index-DkeKGeNw.css">
 	</head>
 	<body>
 		<div id="app"></div>