Browse Source

增加标题推荐逻辑

pull/1/head
zq 5 months ago
parent
commit
778a8fafc6
  1. 336
      home.html
  2. 121
      style/css/index.css
  3. 1
      style/img/line11111.svg
  4. 1
      style/img/posCircle.svg
  5. 1
      style/img/posRight.svg
  6. 1
      style/img/posStart.svg
  7. BIN
      style/img/stepDone.png
  8. 1
      style/img/stepSucc.svg
  9. BIN
      style/img/stepWaiting.png
  10. 123
      style/js/index.js

336
home.html

@ -7,15 +7,15 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{if $_siteinfo.site_introduction_name}{$_siteinfo.site_introduction_name}{else}AI论文{/if}</title>
{if $site_ico}<link rel="shortcut icon" href="{$site_ico}" type="image/x-icon" />{/if}
<link rel="stylesheet" type="text/css" href="{$priv_style}/css/index.css?v=191">
<script src="{$priv_style}/js/jquery-3.6.0.min.js"></script>
<script src="{$priv_style}/js/index.js"></script>
<link rel="stylesheet" type="text/css" href="./style/css/index.css?v=192">
<script src="./style/js/jquery-3.6.0.min.js"></script>
<script src="./style/js/index.js"></script>
</head>
<body>
<div class="big_container">
<header>
<div class="left">
<img src="{$priv_style}/img/title_logo.svg" alt="">
<img src="./style/img/title_logo.svg" alt="">
AI 写作大师
</div>
<div class="right">
@ -38,7 +38,7 @@
<div class="backColor2 main_title_back">
<div class="main_title">
<div class="title1">
<img src="{$priv_style}/img/AIteacher.png" alt="">
<img src="./style/img/AIteacher.png" alt="">
</div>
<div class="title2">
<span>一键生成万字论文</span>
@ -57,7 +57,7 @@
<div class="step_main">
<dl class="normal_step active_step">
<dt>
<img src="{$priv_style}/img/step_1.svg" alt="">
<img src="./style/img/step_1.svg" alt="">
</dt>
<dd>
<span class="nor_step_title active_step_title">输入论文题目</span>
@ -67,7 +67,7 @@
<div class="step_line"></div>
<dl class="normal_step">
<dt>
<img src="{$priv_style}/img/step_2.svg" alt="">
<img src="./style/img/step_2.svg" alt="">
</dt>
<dd>
<span class="nor_step_title">编辑大纲</span>
@ -77,7 +77,7 @@
<div class="step_line"></div>
<dl class="normal_step">
<dt>
<img src="{$priv_style}/img/step_3.svg" alt="">
<img src="./style/img/step_3.svg" alt="">
</dt>
<dd>
<span class="nor_step_title">下载论文</span>
@ -89,119 +89,321 @@
<div class="backColor2">
<ul class="main_select">
<li class="active_select">
<img src="{$priv_style}/img/ch_templete.svg" alt="" class="li_icon">
<img src="./style/img/ch_templete.svg" alt="" class="li_icon">
<span>毕业论文</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon active_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon active_icon">
</li>
<li>
<img src="{$priv_style}/img/calsstext.svg" alt="" class="li_icon">
<img src="./style/img/calsstext.svg" alt="" class="li_icon">
<span>课程论文</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/chaungyeplan.svg" alt="" class="li_icon">
<img src="./style/img/chaungyeplan.svg" alt="" class="li_icon">
<span>专升本计划书</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/zhichenglunwen.png" alt="" class="li_icon">
<img src="./style/img/zhichenglunwen.png" alt="" class="li_icon">
<span>职称论文</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/lunwenTitle.png" alt="" class="li_icon">
<img src="./style/img/lunwenTitle.png" alt="" class="li_icon">
<span>论文选题</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/zongshunew.svg" alt="" class="li_icon">
<img src="./style/img/zongshunew.svg" alt="" class="li_icon">
<span>文献综述</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/ppt_more.svg" alt="" class="li_icon">
<img src="./style/img/ppt_more.svg" alt="" class="li_icon">
<span>答辩PPT</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/renwushu.png" alt="" class="li_icon">
<img src="./style/img/renwushu.png" alt="" class="li_icon">
<span>任务书</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
<li>
<img src="{$priv_style}/img/eng_templete.svg" alt="" class="li_icon">
<img src="./style/img/eng_templete.svg" alt="" class="li_icon">
<span>英文论文</span>
<img src="{$priv_style}/img/select_icon.svg" alt="" class="select_icon">
<img src="./style/img/select_icon.svg" alt="" class="select_icon">
</li>
</ul>
<form action="" class="my_form">
<div class="formOne">
<input type="hidden" id="cur_title" value="">
<input type="hidden" id="cur_title_type" value="0">
<input type="hidden" id="cur_request" value="0">
<div class="custom-select">
<div class="placeBox">
请选择您的论文专业
<img src="{$priv_style}/img/selectIcon.svg" alt="">
<img src="./style/img/selectIcon.svg" alt="">
</div>
<select id="project_select" name="fruits" >
<option value="" selected disabled>请选择您的论文专业</option>
<option value="apple">苹果</option>
<option value="orange">橙子</option>
<option value="banana">香蕉</option>
<option value="grape">葡萄</option>
</select>
<option value="1">经济</option>
<option value="2">教育</option>
<option value="3">文学</option>
<option value="4">医药</option>
<option value="5">法律</option>
<option value="6">计算机科学</option>
<option value="7">建筑科学</option>
<option value="8">工业技术</option>
<option value="9">其它(自动识别)</option>
</select>
</div>
<div class="oneRight">
<img src="{$priv_style}/img/input_icon.svg" alt="">
<img src="./style/img/input_icon.svg" alt="">
<input type="text" class="inputChange" placeholder="输入完整的论文标题,获得更好的生成效果">
<div class="total_length">
<span class="inputText">0/50</span>
</div>
<div class="normal_recommend_title">
<img src="{$priv_style}/img/title_icon.svg" alt="">
<img src="./style/img/title_icon.svg" alt="">
<span>标题推荐</span>
</div>
<div class="aititlePos">
<div class="aititlePos disNone">
<div class="posBack">
<div class="posHead">
<img src="" alt="">
<div class="posHead flex">
<img src="./style/img/posStart.svg" alt="">
<p>您输入的标题更像是论文要求呢,让AI帮您优化标题吧!</p>
</div>
<div class="posStep">
<img src="" alt="">
<span></span>
<img src="" alt="" class="posLine">
<img src="" alt="">
<span></span>
<img src="" alt="" class="posLine">
<img src="" alt="">
<span></span>
<div class="posStep flex">
<img src="./style/img/posCircle.svg" alt="">
<span>标题不合格,接受AI推荐</span>
<img src="./style/img/line11111.svg" alt="" class="posLine">
<img src="./style/img/posCircle.svg" alt="">
<span>AI深度分析,根据内容推荐标题</span>
<img src="./style/img/line11111.svg" alt="" class="posLine">
<img src="./style/img/posCircle.svg" alt="">
<span>选择推荐标题</span>
</div>
</div>
<div class="posFooter">
<button class="ignoreBtn">忽略</button>
<button class="startBtn">开始优化</button>
<div class="ignoreBtn" onclick="hideDom('aititlePos')">忽略</div>
<div class="startBtn" onclick="startGetTitle('aititlePos')">开始优化</div>
</div>
</div>
</div>
<div id="loading" class="opt-area opt-click-hide disNone loadingPos">
<div class="loading-area">
<div class="step-icon" id="loading-step1"></div>
<div class="step-text">预处理信息</div>
<div class="step-line"></div>
<div class="step-icon" id="loading-step2"></div>
<div class="step-text">AI分析填写内容</div>
<div class="step-line"></div>
<div class="step-icon" id="loading-step3"></div>
<div class="step-text">AI匹配原创标题</div>
<div class="step-line"></div>
<div class="step-icon" id="loading-step4"></div>
<div class="step-text">完成</div>
</div>
</div>
<script>
$(document).ready(function () {
// 等待页面加载完毕
$(window).on('load', function () {
// optButton();
checkAiTitle();
});
});
function hideDom(dom){
if($(dom).hasClass('disBlock'))$(dom).removeClass('disBlock')
$(dom).addClass('disNone')
}
function showDom(dom){
if($(dom).hasClass('disNone'))$(dom).removeClass('disNone')
$(dom).addClass('disBlock')
}
function startGetTitle(){
console.log('--------888');
hideDom('.aititlePos')
adviseTitle(true)
}
$('.inputChange').on('blur', function() {
checkAiTitle()
});
function adviseTitle(refresh = false){
if($('#loading').css('display') == 'block'){
return false;
}
let title = $('.inputChange').val();
if(!title){
alert('请输入标题')
return false;
}
let cur_title= $('#cur_title').val();
if(cur_title != title || refresh){
//初始化推荐标题
$('#advise-ul').html('')
$('#cur_title').val(title);
$('#cur_request').val(0);
}
//删除所有动画
var steps = document.querySelectorAll('.step-icon');
steps.forEach(function(step) {
step.innerHTML = '';
step.classList.remove('step-icon-active');
step.classList.remove('step-icon-done');
});
showDom('#loading');
//第一步 默认完成
let obj = document.getElementById('loading-step1');
obj.classList.add('step-icon-done');
//第二步 开启完成动画
let ani2 = stepLoading(2, 'done')
ani2.addEventListener('complete', function() {
stepDone(2, ani2)
//第三步 等待第二步动画加载完成 开启加载动画
let ani3 = stepLoading(3, 'analysis')
if($('#advise-ul').html()){
//如果推荐已存在 销毁加载动画 开启完成动画
ani3.destroy();
ani3 = stepLoading(3, 'done')
ani3.addEventListener('complete', function() {
stepDone(3, ani3)
//第四步默认完成
let ani4 = stepLoading(4, 'done')
ani4.addEventListener('complete', function() {
ani4.destroy();
});
showAdviseList()
});
}else{
getAdviseTitle()
}
});
}
function stepLoading(step, status = 'analysis'){
let obj = document.getElementById('loading-step'+step);
obj.innerHTML = '';
obj.classList.remove('step-icon-done');
obj.classList.add('step-icon-active');
// if(status == 'analysis'){
// return lottie.loadAnimation({
// container: obj, //dom元素的容器
// loop: true, //循环播放
// autoplay: true, //自动播放
// path: "//css.chachongz.com/images/ai2/modelessay/loading_analysis.json", // AE 导出JSON文件
// });
// }else{
// return lottie.loadAnimation({
// container: obj, //dom元素的容器
// loop: false, //循环播放
// autoplay: true, //自动播放
// path: "//css.chachongz.com/images/ai2/modelessay/loading_done.json", // AE 导出JSON文件
// });
// }
}
function getAdviseTitle(){
let title = $('.inputChange').val();
let title_type = $('#project_select').val()
console.log($('#project_select'),title_type);
$.ajax({
type: "post",
url: 'http://aitest.chachongz.com/ajax_advise_ai_title',
data: {
title: title,
title_type: title_type
},
success: function(jsondata) {
$('#cur_request').val(0)
var res = JSON.parse(jsondata);
console.log(res,'=====');
if(!res.status){
alert(res.info);
return false;
}
if(res.data.title != $('#cur_title').val()){
return false;
}
if(res.data.list.length>0){
let html = ''
res.data.list.forEach(function(item) {
html += '<div onclick="confirmTitle(this)" class="advise-li">'+item+'</div>';
});
$('#advise-ul').html(html);
let ani3 = stepLoading(3, 'done')
ani3.addEventListener('complete', function() {
stepDone(3, ani3)
//第四步默认完成
let ani4 = stepLoading(4, 'done')
ani4.addEventListener('complete', function() {
ani4.destroy();
});
showAdviseList()
});
}
}
});
}
function checkAiTitle() {
let title = $('.inputChange').val();
$.ajax({
type: "post",
url: 'http://aitest.chachongz.com/ajax_check_ai_title',
data: {
title: title
},
success: function (jsondata) {
var res = JSON.parse(jsondata);
if (!res.status) {
alert(res.info);
return false;
}
$('#cur_title_type').val(res.data);
if (res.status && res.data != 1) {
console.log('----',$('#loading').hasClass('disNone'));
if($('#loading').hasClass('disNone')){
showDom('.aititlePos')
}
}
}
});
}
</script>
</div>
</div>
<div class="formItem">
<div class="formLeft">
选择学历
<img class="requiredIcon" src="{$priv_style}/img/required_icon.svg" alt="">
<img class="requiredIcon" src="./style/img/required_icon.svg" alt="">
</div>
<div class="formRight educationRight" id="educationRight">
<div class="education" onclick="">
<img src="{$priv_style}/img/education_no_select.svg" alt="">
<img src="./style/img/education_no_select.svg" alt="">
<label for="option1">大专</label>
</div>
<div class="education">
<img src="{$priv_style}/img/education_select.svg" alt="">
<img src="./style/img/education_select.svg" alt="">
<label for="option2">本科</label>
</div>
<div class="education">
<img src="{$priv_style}/img/education_no_select.svg" alt="">
<img src="./style/img/education_no_select.svg" alt="">
<label for="option3">硕博</label>
</div>
</div>
@ -215,19 +417,19 @@
<div class="formItem">
<div class="formLeft">
论文字数
<img class="requiredIcon" src="{$priv_style}/img/required_icon.svg" alt="">
<img class="requiredIcon" src="./style/img/required_icon.svg" alt="">
</div>
<div class="formRight educationRight" id="textLength">
<div class="education" onclick="">
<img src="{$priv_style}/img/education_no_select.svg" alt="">
<img src="./style/img/education_no_select.svg" alt="">
<label for="option1">约8000字</label>
</div>
<div class="education">
<img src="{$priv_style}/img/education_select.svg" alt="">
<img src="./style/img/education_select.svg" alt="">
<label for="option2">约10000字</label>
</div>
<div class="education">
<img src="{$priv_style}/img/education_no_select.svg" alt="">
<img src="./style/img/education_no_select.svg" alt="">
<label for="option3">约20000字</label>
</div>
</div>
@ -237,19 +439,19 @@
<div class="formRight ">
<div class="educationRight">
<div class="education" onclick="">
<img src="{$priv_style}/img/no_checked_icon.svg" alt="">
<img src="./style/img/no_checked_icon.svg" alt="">
<label for="option1">图片</label>
</div>
<div class="education">
<img src="{$priv_style}/img/no_checked_icon.svg" alt="">
<img src="./style/img/no_checked_icon.svg" alt="">
<label for="option2">表格</label>
</div>
<div class="education">
<img src="{$priv_style}/img/checked_icon.svg" alt="">
<img src="./style/img/checked_icon.svg" alt="">
<label for="option3">公式</label>
</div>
<div class="education">
<img src="{$priv_style}/img/checked_icon.svg" alt="">
<img src="./style/img/checked_icon.svg" alt="">
<label for="option3">代码</label>
</div>
</div>
@ -259,7 +461,7 @@
</form>
<button class="btn_result">生成论文大纲</button>
<p>
<img src="{$priv_style}/img/checked_icon.svg" alt="">
<img src="./style/img/checked_icon.svg" alt="">
我已阅读并同意:生成的论文范文仅用于参考,不作为毕业论文使用
</p>
</div>
@ -268,12 +470,12 @@
<div class="footerbox backColor2">
<div class="main_footer">
<div class="left_top">
<img src="{$priv_style}/img/title_logo.svg" alt="">
<img src="./style/img/title_logo.svg" alt="">
AI 写作大师
</div>
<div class="left">
<p>beijingkashdklasl</p>
<!-- {if $company_name !=''}<p>{$company_name}</p>{/if} -->
<!-- <p>beijingkashdklasl</p> -->
{if $company_name !=''}<p>{$company_name}</p>{/if}
<p>专注于AI创意与技术创新的企业,提供AI写作与AI制作PPT解决方案。业务涵盖先进模型开发、技术支持、市场推广与销售。</p>
</div>
<div class="right">

121
style/css/index.css

@ -7,6 +7,31 @@ body,p,div{
/* right: calc((100% - 1680px) / 2); */
}
}
.flex{
display: flex;
}
.ft12{
font-size: 12px;
}
.ft14{
font-size: 14px;
}
.ft16{
font-size: 16px;
}
.ft18{
font-size: 18px;
}
.disNone{
display: none !important;
opacity: 0;
transition: all .3s;
}
.disBlock{
opacity: 1;
transition: all .3s;
display: block !important;
}
.big_container{
/* width: 100%;
height: 100vh; */
@ -461,14 +486,12 @@ li .select_icon{
.oneRight input:focus-visible{
outline: none;
}
.aititlePos{
display: none;
.loadingPos,.aititlePos{
/* display: none; */
position: absolute;
left: 0px;
top: 48px;
/* width: 910px; */
width: calc(100% - 28px);
height: 168px;
/* 自动布局 */
display: flex;
flex-direction: column;
@ -476,7 +499,6 @@ li .select_icon{
padding: 16px 14px;
gap: 12px;
border-radius: 8px;
opacity: 0;
background: #FFFFFF;
border: 1px solid #E8E8E8;
box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.08);
@ -487,7 +509,7 @@ li .select_icon{
left: 14px;
top: 16px; */
/* width: 882px; */
height: 106px;
/* height: 106px; */
/* 自动布局 */
display: flex;
flex-direction: column;
@ -498,18 +520,99 @@ li .select_icon{
z-index: 0;
border-radius: 8px;
opacity: 1;
margin-bottom: 12px;
background: linear-gradient(180deg, #EDF1FE 0%, #FCFDFF 119%);
}
.posHead{
font-family: MicrosoftYaHeiUI;
font-size: 16px;
font-weight: normal;
line-height: normal;
letter-spacing: 0px;
font-variation-settings: "opsz" auto;
color: #282828;
line-height: 20px;
/* margin-bottom: 14px; */
}
.posHead img{
width: 18px;
height: 18px;
margin-right: 6px;
}
.posStep{
width: 100%;
align-items: center;
font-size: 12px;
max-width: 710px;
}
.posStep img{
width: 6px;
height: 6px;
margin-right: 6px;
}
.posStep .posLine{
flex: 1;
margin: 0 8px;
min-width: 16px;
/* max-width: ; */
}
.posFooter{
display: flex;
justify-content: flex-end;
color: #8C919D;
font-size: 14px;
line-height: 16px;
}
.posFooter div{
background: transparent;
border: none;
color: #8C919D;
cursor: pointer;
}
.startBtn{
.posFooter .startBtn{
color: #5B6FF6;
margin-left: 20px;
}
.loading-area{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 84px;
background: linear-gradient( 180deg, #F1FBFF 0%, #ECF3FF 100%);
border-radius: 8px;
font-weight: 400;
font-size: 12px;
color: #8B919A;
text-align: center;
}
.step-icon{
width:18px;
height: 18px;
margin-right: 4px;
/* background-image: url(//css.chachongz.com/images/ai2/modelessay/loading_step_gray.png); */
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.step-text{
font-size: 12px;
color: #8B919A;
line-height: 84px;
}
.step-icon-done{
background-image: url(../img/stepDone.png);
}
.step-icon-done+.step-text{
color: #282828;
}
.step-icon-active{
background-image: none;
margin-top: -22px;
}
.step-icon-active+.step-text{
color: #1675FF;
}
.normal_recommend_title,.recommend_title{
width: 82px;
margin-left: 12px;
@ -518,13 +621,15 @@ li .select_icon{
justify-content: space-between;
align-items: center;
border-radius: 6px;
background: #F9FAFA;
padding: 8px 12px;
cursor: pointer;
transition: all .5s;
}
.recommend_title{
background: #FFF5ED;
color: #FF7800;
transition: all .5s;
}
.inputText{
color: #525252;

1
style/img/line11111.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="101" height="2" viewBox="0 0 101 2"><g><path d="M95.4771,3.9L100.5,1L95.4771,-1.9L95.4771,0.4999999999999998L0.5,0.5L-0.000001999999999946489,0.49999773502L-0.000001999999999946489,1.5L0.5,1.5L95.4771,1.5L95.4771,3.9Z" fill-rule="evenodd" fill="#D1D4DB" fill-opacity="1"/></g></svg>

After

Width:  |  Height:  |  Size: 398 B

1
style/img/posCircle.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="6" height="6" viewBox="0 0 6 6"><g><g><ellipse cx="3" cy="3" rx="3" ry="3" fill="#5B6FF6" fill-opacity="1"/></g></g></svg>

After

Width:  |  Height:  |  Size: 238 B

1
style/img/posRight.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="17.5" height="2" viewBox="0 0 17.5 2"><g><path d="M11.9771,3.9L17,1L11.9771,-1.9L11.9771,0.4999999999999998L0.5,0.5L-0.000001999999999946489,0.49999773502L-0.000001999999999946489,1.5L0.5,1.5L11.9771,1.5L11.9771,3.9Z" fill-rule="evenodd" fill="#D1D4DB" fill-opacity="1"/></g></svg>

After

Width:  |  Height:  |  Size: 397 B

1
style/img/posStart.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><defs><filter id="master_svg0_4_15919" filterUnits="objectBoundingBox" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" type="matrix" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="0" dx="0"/><feGaussianBlur stdDeviation="1.5"/><feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/><feColorMatrix type="matrix" values="0 0 0 0 0.9843137264251709 0 0 0 0 0.6392157077789307 0 0 0 0 0.12941177189350128 0 0 0 1 0"/><feBlend mode="normal" in2="shape" result="effect1_innerShadow"/></filter><linearGradient x1="0.5" y1="0" x2="0.5" y2="1" id="master_svg1_3_2168"><stop offset="0%" stop-color="#FFFFF3" stop-opacity="1"/><stop offset="100%" stop-color="#FEE95F" stop-opacity="1"/></linearGradient></defs><g><g filter="url(#master_svg0_4_15919)"><path d="M17.9673,6.83653C17.8908,6.60833,17.6934,6.4412,17.4549,6.40455L12.024,5.56629L9.59716,0.370921C9.49172,0.145289,9.26544,0.000654731,9.01601,0C9.01538,0,9.01472,0,9.01472,0C8.76658,0,8.54029,0.143346,8.43358,0.368345L5.98212,5.55827L0.534656,6.3737C0.299359,6.41418,0.105862,6.58133,0.031936,6.80825C-0.0426451,7.03454,0.0158623,7.28395,0.181732,7.45495L4.1283,11.5144L3.1865,17.2344C3.14664,17.4767,3.24885,17.7217,3.45008,17.8637C3.65065,18.0058,3.91552,18.0212,4.13088,17.9023L8.98902,15.23L13.8369,17.919C13.9339,17.973,14.0413,18,14.1487,18C14.2785,18,14.4078,17.9614,14.5177,17.8824C14.7189,17.7409,14.8224,17.4967,14.7832,17.2537L13.8607,11.5311L17.8169,7.48899C17.9846,7.31737,18.0432,7.06474,17.9673,6.83653Z" fill="url(#master_svg1_3_2168)" fill-opacity="1"/></g></g></svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
style/img/stepDone.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

1
style/img/stepSucc.svg

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="18" height="18" viewBox="0 0 18 18"><defs><clipPath id="master_svg0_4_7241"><rect x="0" y="0" width="18" height="18" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_4_7241)"><g><g><g><ellipse cx="9.102272510528564" cy="8.897727489471436" rx="6.8522725105285645" ry="6.8522725105285645" fill="#5B6FF6" fill-opacity="1" style="mix-blend-mode:passthrough"/><ellipse cx="9.102272510528564" cy="8.897727489471436" rx="6.8522725105285645" ry="6.8522725105285645" fill-opacity="0" stroke-opacity="1" stroke="#5B6FF6" fill="none" stroke-width="1.4318181276321411" style="mix-blend-mode:passthrough"/></g><g><path d="M13.05613649368286,6.1769454784698485C12.737046493682861,5.850102678469849,12.219746493682862,5.850102678469849,11.900656493682861,6.1769454784698485L8.241626493682862,9.92606347846985L6.508406493682862,8.150233478469849C6.1893164936828615,7.823253478469849,5.672024493682861,7.823253478469849,5.353015493682861,8.150233478469849C5.033843293682861,8.477083478469849,5.033843293682861,9.007223478469848,5.353015493682861,9.334163478469849L7.663906493682861,11.70196347846985C7.982996493682862,12.028973478469847,8.500256493682862,12.028973478469847,8.819346493682861,11.70196347846985L13.05613649368286,7.3608934784698485C13.375226493682861,7.033973478469848,13.375226493682861,6.503911478469849,13.05613649368286,6.1769454784698485Z" fill="#FFFFFF" fill-opacity="1" style="mix-blend-mode:passthrough"/></g></g></g></g></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
style/img/stepWaiting.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

123
style/js/index.js

@ -1,4 +1,8 @@
$(document).ready(function() {
var notRadio = '';
var yesRadio = '';
var notChecked = '';
var checked = '';
$.get('你的接口URL', function(response) {
// 请求成功时的回调函数
console.log(response);
@ -12,13 +16,14 @@ $(document).ready(function() {
var distanceToTop = element.offset().top - $(this).scrollTop();
if(distanceToTop <= 64){
element.addClass('stickyStep')
}else{
element.removeClass('stickyStep')
}
});
//标题输入字数
$('.inputChange').on('keyup', function() {
$('.inputChange').on('input', function() {
// var maxLength = $(this).attr('maxlength');
var currentLength = $(this).val().length;
console.log(currentLength,'currentLength');
if(currentLength > 0){
$('.normal_recommend_title').addClass('recommend_title')
}else{
@ -32,9 +37,10 @@ $(document).ready(function() {
// $('.inputText').removeClass('recommend_title')
}
});
$('.inputChange').on('blur', function() {
});
// $('.inputChange').on('blur', function() {
// console.log('blur----');
// getAiTitleList()
// });
$('.normal_step').click(function(e) {
});
@ -45,49 +51,82 @@ $(document).ready(function() {
function hideOptArea(){
$('.opt-area').css('display','none');
}
// $.ajax({
// type: "post",
// url: 'http://aitest.chachongz.com/ajax_advise_ai_title',
// data: {
// title: '兔子吃草研究',
// title_type: '1'
// },
// success: function(jsondata) {
// // $('#cur_request').val(0)
function getAiTitleList(){
let title = $('.inputChange').val();
let title_type = $('#project_select').val()
console.log($('#project_select'),title_type);
$.ajax({
type: "post",
url: 'http://aitest.chachongz.com/ajax_advise_ai_title',
data: {
title: title,
title_type: title_type
},
success: function(jsondata) {
// $('#cur_request').val(0)
// var res = JSON.parse(jsondata);
// console.log(res,'=====');
// // if(!res.status){
// // alert(res.info);
// // return false;
// // }
var res = JSON.parse(jsondata);
console.log(res,'=====');
// if(!res.status){
// alert(res.info);
// return false;
// }
// // if(res.data.title != $('#cur_title').val()){
// // return false;
// // }
// if(res.data.title != $('#cur_title').val()){
// return false;
// }
// // if(res.data.list.length>0){
// // let html = ''
// // res.data.list.forEach(function(item) {
// // html += '<div onclick="confirmTitle(this)" class="advise-li">'+item+'</div>';
// // });
// // $('#advise-ul').html(html);
// if(res.data.list.length>0){
// let html = ''
// res.data.list.forEach(function(item) {
// html += '<div onclick="confirmTitle(this)" class="advise-li">'+item+'</div>';
// });
// $('#advise-ul').html(html);
// // let ani3 = stepLoading(3, 'done')
// // ani3.addEventListener('complete', function() {
// // stepDone(3, ani3)
// let ani3 = stepLoading(3, 'done')
// ani3.addEventListener('complete', function() {
// stepDone(3, ani3)
// // //第四步默认完成
// // let ani4 = stepLoading(4, 'done')
// // ani4.addEventListener('complete', function() {
// // ani4.destroy();
// // });
// //第四步默认完成
// let ani4 = stepLoading(4, 'done')
// ani4.addEventListener('complete', function() {
// ani4.destroy();
// });
// // showAdviseList()
// // });
// // }
// }
// });
// showAdviseList()
// });
// }
}
});
}
function checkAiTitle() {
let title = $('.inputChange').val();
$.ajax({
type: "post",
url: '/ajax_check_ai_title',
data: {
title: title
},
success: function (jsondata) {
var res = JSON.parse(jsondata);
if (!res.status) {
alert(res.info);
return false;
}
$('#cur_title_type').val(res.data);
if (res.status && res.data != 1) {
if($('#loading').css('display') == 'none'){
showOptArea('not-title');
}
}
}
});
}
function showAdviseTitle(){
console.log('haha');
}
$('li').click(function(e) {
if ($('li').hasClass('active_select')) {
$('li').removeClass('active_select')

Loading…
Cancel
Save