mirror of
https://github.com/cool-team-official/cool-admin-vue.git
synced 2024-11-01 14:10:27 +08:00
1
This commit is contained in:
神仙
parent
1ff3964f28
commit
37c5b1c0fb
3012
build/cool/eps.d.ts
vendored
3012
build/cool/eps.d.ts
vendored
File diff suppressed because it is too large
Load Diff
1
src/modules/helper/static/svg/enter.svg
Normal file
1
src/modules/helper/static/svg/enter.svg
Normal file
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1719328305980" class="icon" viewBox="0 0 1194 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1395" xmlns:xlink="http://www.w3.org/1999/xlink" width="233.203125" height="200"><path d="M1151.9144 325.11999969V89.12a57.04000031 57.04000031 0 0 0-28.8-49.44 58.15999969 58.15999969 0 0 0-57.76000031 0 57.04000031 57.04000031 0 0 0-28.8 49.44v235.99999969c0.24 84.31999969-33.6 152.56000031-94.08 212.00000062-60.07999969 59.83999969-141.84 80.64-227.04 80.4H225.91440031L388.07439969 457.11999969a56.80000031 56.80000031 0 0 0 12.40000031-62.16 57.76000031 57.76000031 0 0 0-94.00000031-18.63999938L48.8744 631.20000031a56.88 56.88 0 0 0 0 80.79999938l264.96 262.56a58.08 58.08 0 0 0 96.55999969-25.59999938 56.80000031 56.80000031 0 0 0-14.95999969-55.2L232.07439969 731.67999969h483.44000062c116.56000031 0 226.15999969-32.08000031 308.64-113.76 82.15999969-80.80000031 128.23999969-178.15999969 127.83999938-292.87999969" p-id="1396"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -16,56 +16,68 @@
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="editor">
|
||||
<div class="topbar">
|
||||
<div class="dots">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<div class="enter" v-if="step.value == 'none'">
|
||||
<el-input
|
||||
v-model="form.name"
|
||||
placeholder="如：收货地址、商品列表"
|
||||
@focus="desc.change('name')"
|
||||
@keydown.enter="step.next"
|
||||
/>
|
||||
<cl-svg name="enter" class="icon" />
|
||||
</div>
|
||||
|
||||
<template v-if="step.value == 'form'">
|
||||
<div class="editor">
|
||||
<div class="topbar">
|
||||
<div class="dots">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<div class="form">
|
||||
<div
|
||||
class="form-item"
|
||||
v-for="(item, index) in form.list"
|
||||
:key="index"
|
||||
>
|
||||
<p class="label">{{ item.label }}</p>
|
||||
<div class="content">
|
||||
<div class="form">
|
||||
<div
|
||||
class="form-item"
|
||||
v-for="(item, index) in form.list"
|
||||
:key="index"
|
||||
>
|
||||
<p class="label">{{ item.label }}</p>
|
||||
|
||||
<el-input resize="none" :placeholder="item.desc">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<arrow-right />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-input resize="none" :placeholder="item.desc">
|
||||
<template #prefix>
|
||||
<el-icon>
|
||||
<arrow-right />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btns">
|
||||
<el-button
|
||||
size="large"
|
||||
color="#41d1ff"
|
||||
:icon="Promotion"
|
||||
:disabled="temp.disabled"
|
||||
:loading="temp.disabled"
|
||||
@click="next"
|
||||
>
|
||||
{{
|
||||
temp.disabled
|
||||
? "思考中"
|
||||
: codes.entity.length
|
||||
? "重新生成"
|
||||
: "下一步"
|
||||
}}
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<el-button
|
||||
size="large"
|
||||
color="#41d1ff"
|
||||
:icon="Promotion"
|
||||
:disabled="temp.disabled"
|
||||
:loading="temp.disabled"
|
||||
@click="next"
|
||||
>
|
||||
{{
|
||||
temp.disabled
|
||||
? "思考中"
|
||||
: codes.entity.length
|
||||
? "重新生成"
|
||||
: "下一步"
|
||||
}}
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="tips">如遇见 “代码缺失”、“请求超时”，请尝试「刷新」吧</div>
|
||||
<div class="tips">如遇见 “代码缺失”、“请求超时”，请尝试「刷新」吧</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="panel-code">
|
||||
@ -160,7 +172,7 @@ monaco.editor.defineTheme("ai-code--dark", {
|
||||
const step = reactive({
|
||||
value: "none",
|
||||
|
||||
list: ["none", "coding"],
|
||||
list: ["none", "form", "coding"],
|
||||
|
||||
next() {
|
||||
const i = step.list.indexOf(step.value);
|
||||
@ -181,10 +193,27 @@ const step = reactive({
|
||||
|
||||
// 滚动文案
|
||||
const desc = reactive({
|
||||
list: ["为开发者生成优质编程代码", "只需少量的口语提示就能完成特定的功能，大大节省开发时间"],
|
||||
list: [] as string[],
|
||||
text: "",
|
||||
|
||||
init() {
|
||||
change(action?: string) {
|
||||
if (action == "name") {
|
||||
desc.list = ["请简要描述您的功能，AI帮你写代码"];
|
||||
} else {
|
||||
desc.list = [
|
||||
"为开发者生成优质编程代码",
|
||||
"只需少量的口语提示就能完成特定的功能，大大节省开发时间"
|
||||
];
|
||||
}
|
||||
|
||||
desc.start();
|
||||
},
|
||||
|
||||
t1: null as any,
|
||||
t2: null as any,
|
||||
start() {
|
||||
desc.stop();
|
||||
|
||||
function next(n: number) {
|
||||
const val = desc.list[n];
|
||||
|
||||
@ -193,20 +222,22 @@ const desc = reactive({
|
||||
const v = val[n2];
|
||||
|
||||
if (v) {
|
||||
setTimeout(() => {
|
||||
desc.t2 = setTimeout(() => {
|
||||
desc.text += v;
|
||||
next2(n2 + 1);
|
||||
}, 60);
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
const timer = setInterval(() => {
|
||||
desc.text = desc.text.slice(0, -1);
|
||||
if (desc.list.length > 1) {
|
||||
desc.t1 = setInterval(() => {
|
||||
desc.text = desc.text.slice(0, -1);
|
||||
|
||||
if (!desc.text) {
|
||||
clearInterval(timer);
|
||||
next(n + 1);
|
||||
}
|
||||
}, 50);
|
||||
if (!desc.text) {
|
||||
clearInterval(desc.t1);
|
||||
next(n + 1);
|
||||
}
|
||||
}, 50);
|
||||
}
|
||||
}, 1500);
|
||||
}
|
||||
}
|
||||
@ -217,7 +248,25 @@ const desc = reactive({
|
||||
}
|
||||
}
|
||||
|
||||
next(0);
|
||||
if (!isEmpty(desc.list)) {
|
||||
next(0);
|
||||
}
|
||||
},
|
||||
|
||||
stop() {
|
||||
if (desc.t1) {
|
||||
clearInterval(desc.t1);
|
||||
}
|
||||
|
||||
if (desc.t2) {
|
||||
clearTimeout(desc.t2);
|
||||
}
|
||||
|
||||
desc.text = "";
|
||||
},
|
||||
|
||||
init() {
|
||||
desc.change();
|
||||
}
|
||||
});
|
||||
|
||||
@ -266,6 +315,8 @@ const editor = reactive({
|
||||
|
||||
// 表单
|
||||
const form = reactive({
|
||||
name: "",
|
||||
columns: [],
|
||||
list: [
|
||||
{
|
||||
label: "请填写功能名称",
|
||||
@ -711,6 +762,9 @@ $color: #41d1ff;
|
||||
}
|
||||
|
||||
.panel-free {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
width: 1040px;
|
||||
max-width: 100%;
|
||||
@ -730,8 +784,37 @@ $color: #41d1ff;
|
||||
}
|
||||
}
|
||||
|
||||
.enter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
width: 360px;
|
||||
position: relative;
|
||||
|
||||
:deep(.el-input__wrapper) {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
padding: 10px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 0 10px 1px #4165d719;
|
||||
|
||||
.el-input__inner {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon {
|
||||
position: absolute;
|
||||
right: 18px;
|
||||
color: #666;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.head {
|
||||
padding: 260px 0 50px 0;
|
||||
padding: 0 0 50px 0;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
@ -916,12 +999,12 @@ $color: #41d1ff;
|
||||
&.is-coding {
|
||||
.panel-free {
|
||||
.title {
|
||||
transform: translateY(-130px);
|
||||
transform: translateY(-5vh);
|
||||
}
|
||||
}
|
||||
|
||||
.panel-code {
|
||||
height: calc(100% - 230px);
|
||||
height: calc(100% - 20vh);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user