提交 c0a781eb authored 作者: 王鹏飞's avatar 王鹏飞

fix: #2223; 优化页面展示;

上级 d224af3e
......@@ -3,15 +3,15 @@
<ul>
<li v-for="(item, index) in inputList" :key="index">
<div class="input-box">
<input type="text" class="input1" placeholder="请输入" v-model="item.input1">
<input type="text" class="input1" placeholder="请输入" v-model="item.input1" />
<div class="icon-x"></div>
<div class="character-input">
<div class="character">%</div>
<input type="text" class="input2" placeholder="请输入" v-model="item.input2">
<input type="text" class="input2" placeholder="请输入" v-model="item.input2" />
</div>
<div class="el-icon-remove" @click="inputRemove(index)"></div>
</div>
<div class="jia-icon" v-if="inputList.length -1 != index"></div>
<div class="jia-icon" v-if="inputList.length - 1 != index"></div>
</li>
</ul>
<div class="add el-icon-circle-plus" @click="inputAdd"></div>
......@@ -27,10 +27,7 @@ export default {
components: { Box },
data() {
return {
inputList: [
{ input1: '', input2: '' },
{ input1: '', input2: '' }
]
inputList: [{ input1: '', input2: '' }]
}
},
methods: {
......@@ -38,8 +35,8 @@ export default {
this.inputList.push({ input1: '', input2: '' })
},
inputRemove(index) {
if (this.inputList.length <= 2) {
this.$message('最少条')
if (this.inputList.length <= 1) {
this.$message('最少条')
return
}
this.inputList.splice(index, 1)
......@@ -58,59 +55,59 @@ export default {
</script>
<style lang="scss" scoped>
ul{
ul {
padding-left: 20px;
padding-top: 23px;
li{
.input-box{
li {
.input-box {
display: flex;
align-items: center;
}
.jia-icon{
.jia-icon {
width: 28px;
height: 28px;
background: url(https://webapp-pub.ezijing.com/x-training-new/jia.png);
background-size: 100% 100%;
margin: 16px 0 16px 282px;
}
input{
background: #68B8A4;
input {
background: #68b8a4;
box-shadow: 0px 3px 7px 0px rgba(4, 0, 0, 0.29) inset;
border-radius: 6px;
font-size: 16px;
color: #FFFFFF;
color: #ffffff;
padding-left: 15px;
box-sizing: border-box;
height: 41px;
&::-webkit-input-placeholder{
&::-webkit-input-placeholder {
color: #fff;
}
}
.input1{
.input1 {
width: 263px;
}
.input2{
.input2 {
width: 210px;
padding-right: 38px;
}
.character-input{
.character-input {
position: relative;
.character{
.character {
position: absolute;
top: 50%;
right: 18px;
transform: translateY(-50%);
font-size: 16px;
color: #FFFFFF;
color: #ffffff;
}
}
.el-icon-remove{
.el-icon-remove {
font-size: 30px;
cursor: pointer;
color: rgb(204,204,204);
color: rgb(204, 204, 204);
margin-left: 5px;
}
.icon-x{
.icon-x {
width: 26px;
height: 26px;
background: url(https://webapp-pub.ezijing.com/x-training-new/cheng.png);
......@@ -119,15 +116,15 @@ ul{
}
}
}
.compares-box{
.compares-box {
position: relative;
.add{
.add {
position: absolute;
right: 20px;
bottom: 35px;
font-size: 30px;
cursor: pointer;
color: rgb(204,204,204);
color: rgb(204, 204, 204);
}
}
</style>
......@@ -73,7 +73,7 @@ export default {
outline: none;
background: none;
width: 80px;
font-size: 30px;
font-size: 26px;
font-weight: bold;
color: #4eb198;
line-height: 100%;
......
......@@ -5,8 +5,8 @@
<embed class="embed" width="100%" height="100%" :src="cases.pdf_uris[0]" />
</div>
<div class="right-content">
<input type="text" class="code" placeholder="请输入基金简称+基金代码" v-model="titleValue"/>
<div class="title">产品分析报告</div>
<input type="text" class="code" placeholder="请输入基金简称+基金代码" v-model="titleValue" />
<div v-for="(item, index) in completions" :key="index">
<!-- 产品概括 -->
<product ref="product" v-if="item.tag === 'product_overview'" :data="item"></product>
......@@ -65,8 +65,10 @@ export default {
res.data.items.map(item => {
return item.completions.map(cItem => {
if (!Array.isArray(this.resultCompletions)) {
const findData = this.resultCompletions.answer.find(fItem => { return fItem.id === cItem.id })
findData ? cItem.commit_answer = findData.commit_answer : cItem.commit_answer = ''
const findData = this.resultCompletions.answer.find(fItem => {
return fItem.id === cItem.id
})
findData ? (cItem.commit_answer = findData.commit_answer) : (cItem.commit_answer = '')
} else {
cItem.commit_answer = ''
}
......@@ -75,7 +77,9 @@ export default {
})
this.completions = res.data.items
// 标题回显
this.titleValue = this.completions.find(item => { return item.tag === 'product_title' }).completions[0].commit_answer
this.titleValue = this.completions.find(item => {
return item.tag === 'product_title'
}).completions[0].commit_answer
})
},
// 结果
......@@ -116,33 +120,49 @@ export default {
costCount.push({ id: item.id, commit_answer: item.commit_answer })
})
// 标题数据
const findTitleData = this.completions.find(item => { return item.tag === 'product_title' }).completions[0]
const findTitleData = this.completions.find(item => {
return item.tag === 'product_title'
}).completions[0]
const titCount = [{ id: findTitleData.id, commit_answer: this.titleValue }]
const allData = [...productCount, ...investTargetCount, ...[comparesData], ...featuresCount, ...costCount, ...titCount]
if (allData.findIndex(item => { return item.commit_answer === '' }) === -1) {
commitCase({ answers: JSON.stringify(allData) }).then(res => {
const data = {
score: res.data.score,
data: [
this.$refs.product[0].data,
this.$refs.investTarget[0].data,
this.$refs.compares[0].data,
this.$refs.features[0].data,
this.$refs.cost[0].data,
{ tag: 'title', value: this.titleValue }
]
}
window.localStorage.reportData = JSON.stringify(data)
this.$message({
message: '保存成功!你可以在作品展示中查看/编辑报告,查看成绩',
type: 'success'
const allData = [
...productCount,
...investTargetCount,
...[comparesData],
...featuresCount,
...costCount,
...titCount
]
console.log(allData)
if (
allData.findIndex(item => {
return item.commit_answer === ''
}) === -1
) {
commitCase({ answers: JSON.stringify(allData) })
.then(res => {
const data = {
score: res.data.score,
data: [
this.$refs.product[0].data,
this.$refs.investTarget[0].data,
this.$refs.compares[0].data,
this.$refs.features[0].data,
this.$refs.cost[0].data,
{ tag: 'title', value: this.titleValue }
]
}
window.localStorage.reportData = JSON.stringify(data)
this.$message({
message: '保存成功!你可以在作品展示中查看/编辑报告,查看成绩',
type: 'success'
})
setTimeout(() => {
this.$router.push({ path: '/product-analysis/result' })
}, 2000)
})
.catch(err => {
this.$message.error(err.message || '稍后再试')
})
setTimeout(() => {
this.$router.push({ path: '/product-analysis/result' })
}, 2000)
}).catch(err => {
this.$message.error(err.message || '稍后再试')
})
} else {
this.$message('请填写完整')
}
......@@ -171,7 +191,7 @@ input {
border-radius: 10px;
.code {
width: 370px;
margin: 35px auto 0;
margin: 35px auto;
height: 47px;
display: block;
text-align: center;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论