提交 0a3980d5 authored 作者: pengxiaohui's avatar pengxiaohui

fix: 修复进入首页未弹出角色确认框的问题;修复用户研究页报错的问题

上级 d0876984
......@@ -12,7 +12,7 @@ export default {
return {
menuList: [
{ label: '首页', path: '/home', disabled: [] },
{ label: '产品分析', path: '/product-analysis', disabled: [0, 2, 3] },
{ label: '产品分析', path: '/product-analysis', disabled: [0, 2, 3] },
{ label: '用户研究', path: '/user-study', disabled: [0, 1, 3] },
{ label: '营销工具使用', path: '/market-tools', disabled: [0, 1, 2] },
{ label: '作品展示', path: '/works-show', disabled: [] }
......@@ -60,4 +60,4 @@ export default {
color:#c7d4d5;
cursor:not-allowed;
}
</style>
\ No newline at end of file
</style>
<template>
<div class="btn" :style="{ left: attrs.left, top: attrs.top }">
<button>{{attrs.title || ''}}</button>
<button :class="{ disabled: disabled }">{{attrs.title || ''}}</button>
</div>
</template>
<script>
export default {
props: {
disabled: {
type: Boolean,
default: false
},
attrs: {
type: Object,
default() {
......@@ -20,6 +24,22 @@ export default {
position:absolute;
left:0;
top:0;
background:#fff;
border-radius: 16px;
}
.btn::before, .btn::after{
content: '';
display:block;
width:3px;
height:15px;
background:#333;
position:absolute;
left:35%;
top:-15px;
border-radius:1px;
}
.btn::after{
left:65%;
}
button{
display: inline-block;
......@@ -48,4 +68,9 @@ button{
button:hover{
background:rgba(96,167,151, .8);
}
button.disabled{
background:#b4dcd2;
border-color:#c3c3c3;
cursor: not-allowed;
}
</style>
......@@ -55,7 +55,11 @@ export default {
},
methods: {
handleSelect() {
this.$emit('roleSelect', this.roleSelected)
if (this.roleSelected) {
this.$emit('roleSelect', this.roleSelected)
} else {
this.$message.error('请选择角色')
}
}
}
}
......
......@@ -8,8 +8,10 @@
<div class="logo">金融</div>
<app-menu />
</div>
<el-button type="primary" disabled>1111</el-button>
<!-- <btn :attrs="{ title: '用户分析', left: '360px', top: '134px' }" @click.native="handleClick('/user-study')" disabled/> -->
<btn v-for="(item, index) in btnList" :key="index" :attrs="{ title: item.label, left: item.left, top: item.top }" @click.native="handleClick(item)" :disabled="item.disabled.includes(role)"/>
</div>
<!-- <btn :attrs="{ title: '用户研究', left: '240px', top: '120px' }" @click.native="handleClick('/user-study')" /> -->
<role-select :visible="visible" @roleSelect="fetchSelectRole" />
</div>
</template>
......@@ -17,18 +19,18 @@
<script>
import AppMenu from '@/components/base/AppMenu.vue'
import RoleSelect from '../components/RoleSelect.vue'
import Btn from '../components/Btn.vue'
import { selectRole } from '../api'
export default {
components: { AppMenu, RoleSelect },
components: { AppMenu, RoleSelect, Btn },
data() {
return {
visible: false,
menuList: [
{ label: '首页', path: '/home' },
{ label: '产品分析', path: '/product-analysis' },
{ label: '用户研究', path: '/user-study' },
{ label: '营销工具使用', path: '/market-tools' },
{ label: '作品展示', path: '/works-show' }
btnList: [
{ label: '产品分析', path: '/product-analysis', disabled: [0, 2, 3], left: '960px', top: '134px' },
{ label: '用户分析', path: '/user-study', disabled: [0, 1, 3], left: '340px', top: '134px' },
{ label: '营销工具使用', path: '/market-tools', disabled: [0, 1, 2], left: '650px', top: '344px' },
{ label: '作品展示', path: '/works-show', disabled: [], left: '320px', top: '344px' }
],
menuMap: {}
}
......@@ -39,11 +41,21 @@ export default {
},
case() {
return this.$store.state.case
},
role() {
return this.$store.state.role
}
},
created() {
if (!this.role) {
this.visible = true
}
},
methods: {
handleClick(path) {
this.$router.push(path)
handleClick(item) {
if (!item.disabled.includes(this.role)) {
this.$router.push(item.path)
}
},
menuSelect(item) {
this.$router.push(item.path)
......
......@@ -98,35 +98,36 @@ export default {
}
},
created() {
console.log(this.$store.state.case)
this.init()
this.status = this.$route.query.type || '0'
},
methods: {
init() {
if (!(this.$store.state.case && this.$store.state.case.id)) {
this.$alert('请先选择完成产品分析案例选择,再进行用户分析', {
confirmButtonText: '重新开始',
showClose: false,
callback: action => {
this.$route.push('/home')
}
})
} else {
Promise.all([this.fetchQuestions(), this.fetchGetReport()]).then(res => {
// 组装数据
const questions = res[0]
const selection = res[1].answer.options
if (selection.length > 0 && this.status !== '3') {
this.status = '1'
}
this.initQuestions(questions, selection)
Promise.all([this.fetchQuestions(), this.fetchGetReport()]).then(res => {
// 组装数据
const questions = res[0]
console.log(res[0], res[1])
let selection = []
if (res[1].answer && Array.isArray(res[1].answer.options)) {
selection = res[1].answer.options
this.score = res[1].answer.score
this.handleChoiceSelect()
}).catch(err => {
console.log(err)
})
}
}
if (selection.length > 0 && this.status !== '3') {
this.status = '1'
}
this.initQuestions(questions, selection)
this.handleChoiceSelect()
}).catch(err => {
if (!(this.$store.state.case && this.$store.state.case.id)) {
this.$alert('请先选择完成产品分析案例选择,再进行用户分析', {
confirmButtonText: '回到首页',
showClose: false,
callback: action => {
this.$route.push('/home')
}
})
}
})
},
handlePrev() {
this.current.index--
......
......@@ -23,7 +23,7 @@
<div class="btn-bar" v-if="marketing_status">
<el-button type="primary" size="medium" plain round :disabled="[0, 1, 2].includes(role)" @click="handleGo(4)">编辑</el-button>
</div>
<p class="tips" v-else>您还未完成产品分析报告<br>请先去完成吧!</p>
<p class="tips" v-else>您还未完成营销工具使用<br>请先去完成吧!</p>
</div>
</div>
</div>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论