fix: bug
This commit is contained in:
steven
@@ -1,574 +0,0 @@
|
||||
<template>
|
||||
<div class="header">
|
||||
<div class="left">
|
||||
<i class="iconfont icon-xiangzuo-moren"
|
||||
@click="backHome"></i>
|
||||
<div class="question-name">{{ project_name }}</div>
|
||||
</div>
|
||||
<div class="tab-container">
|
||||
<div class="tab-item"
|
||||
v-for="(tab, index) in tabs"
|
||||
:key="index"
|
||||
:class="[tab.link === currentPath ? 'active' : '']"
|
||||
@click="toPage(tab.link, tab.title)">
|
||||
<span :class="tab.link === currentPath ? 'click' : 'click2'">{{ index+1 }}</span>
|
||||
<span>{{ tab.title }}</span>
|
||||
<span v-if="index!=3"
|
||||
style="color:#C4C0C0;margin:0 10px">--------</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right"
|
||||
v-if="showPreview || isRenderBtn || showShare">
|
||||
<template v-if="!showLoading">
|
||||
<div v-show="showPreview"
|
||||
class="preview-btn"
|
||||
@click="toPreview">
|
||||
<i class="iconfont icon-yulan"></i>
|
||||
<span style="margin-left: 6px">预览</span>
|
||||
</div>
|
||||
<a-button v-show="!showPublish && isRenderBtn"
|
||||
type="primary"
|
||||
class="publish-btn"
|
||||
@click="openPublishModal">
|
||||
<template #icon>
|
||||
<i class="iconfont icon-Path"
|
||||
style="font-size: 18px; margin-right: 6px"></i>
|
||||
</template>
|
||||
发布
|
||||
</a-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div style="display: flex; align-items: center">
|
||||
<a-spin size="small" />
|
||||
<span style="margin-left: 10px">正在保存中...</span>
|
||||
</div>
|
||||
</template>
|
||||
<a-button type="primary"
|
||||
class="publish-btn share-button"
|
||||
@click.stop="clickEntrance">
|
||||
<template #icon>
|
||||
<i class="iconfont icon-fenxiang"
|
||||
style="font-size: 18px; margin-right: 6px"></i>
|
||||
</template>
|
||||
分享
|
||||
</a-button>
|
||||
<a-button type="primary"
|
||||
class="download-btn share-button custom-button"
|
||||
@click.stop="toDownload"
|
||||
v-if="showDownload">
|
||||
<template #icon>
|
||||
<img class="download_img"
|
||||
:src="require('@/assets/img/download_center.png')" />
|
||||
</template>
|
||||
下载中心
|
||||
</a-button>
|
||||
<!-- <Avatar :onlyUserShow="false" /> -->
|
||||
</div>
|
||||
<div class="right"
|
||||
v-if="!showPreview && !isRenderBtn && !showShare">
|
||||
<a-button type="primary"
|
||||
class="publish-btn share-button"
|
||||
@click.stop="clickEntrance">
|
||||
<template #icon>
|
||||
<i class="iconfont icon-fenxiang"
|
||||
style="font-size: 18px; margin-right: 6px"></i>
|
||||
</template>
|
||||
分享
|
||||
</a-button>
|
||||
<a-button type="primary"
|
||||
class="download-btn share-button custom-button"
|
||||
@click.stop="toDownload"
|
||||
v-if="showDownload">
|
||||
<template #icon>
|
||||
<img class="download_img"
|
||||
:src="require('@/assets/img/download_center.png')" />
|
||||
</template>
|
||||
下载中心
|
||||
</a-button>
|
||||
<!-- <Avatar :onlyUserShow="false" /> -->
|
||||
</div>
|
||||
</div>
|
||||
<Group ref="groupInfo"
|
||||
:visible="visibleShare"
|
||||
:sn="sn"></Group>
|
||||
<div class="big_box"
|
||||
@click.stop="visibleShare = false"
|
||||
v-show="visibleShare"
|
||||
style="z-index: 1"></div>
|
||||
|
||||
<a-modal v-model:visible="visible"
|
||||
@ok="handlePublish">
|
||||
<div class="content">
|
||||
<div class="tips">
|
||||
<div class="iconfont icon-tixing"></div>
|
||||
<div>提示!</div>
|
||||
</div>
|
||||
<div class="text">确定发布该问卷吗？</div>
|
||||
</div>
|
||||
</a-modal>
|
||||
<!-- 下载中心 -->
|
||||
<DownloadCenter v-model:visible="downloadVisible"
|
||||
v-if="downloadVisible"></DownloadCenter>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted, createVNode } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import useEmitter from "@/composables/useEmitter";
|
||||
import { publishSurvey, getSurveyInfo } from "@/api/publish";
|
||||
import { useStore } from "vuex";
|
||||
import {
|
||||
ExclamationCircleFilled,
|
||||
ShareAltOutlined,
|
||||
ExclamationCircleOutlined,
|
||||
} from "@ant-design/icons-vue";
|
||||
import Group from "./components/Group/Group.vue";
|
||||
import Avatar from "@/views/Home/components/Avatar.vue";
|
||||
import { tr } from "element-plus/lib/locale";
|
||||
import { Modal } from "ant-design-vue";
|
||||
import { cloneDeep } from "lodash";
|
||||
import DownloadCenter from "@/views/DownloadCenter/index.vue"
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const store = useStore();
|
||||
const emitter = useEmitter();
|
||||
const publish_type = 0;
|
||||
const sn = route.query.sn;
|
||||
const tabs = ref([
|
||||
{
|
||||
title: "问卷设计",
|
||||
link: "/survey/planet",
|
||||
},
|
||||
{
|
||||
title: "问卷投放",
|
||||
link: "/survey/publish",
|
||||
},
|
||||
{
|
||||
title: "执行进度",
|
||||
link: "/survey/schedule/recycle",
|
||||
},
|
||||
{
|
||||
title: "数据分析",
|
||||
link: "/survey/analyse",
|
||||
},
|
||||
]);
|
||||
const getParentNode = () => {
|
||||
return document.querySelector(".header");
|
||||
};
|
||||
const visible = ref(false);
|
||||
const project_name = ref("");
|
||||
const currentPath = computed(() => {
|
||||
const matches = route.matched.map((item) => item.path);
|
||||
if (!matches) {
|
||||
return "";
|
||||
}
|
||||
let paths = cloneDeep(matches);
|
||||
|
||||
const links = tabs.value.map((item) => item.link);
|
||||
let nearestPath = "";
|
||||
while (paths.length > 0) {
|
||||
const pop = paths.pop();
|
||||
if (links.includes(pop)) {
|
||||
nearestPath = pop;
|
||||
}
|
||||
}
|
||||
return nearestPath;
|
||||
});
|
||||
|
||||
const toJump = (url) => {
|
||||
router.push(url);
|
||||
};
|
||||
|
||||
const toTeamCenter = () => {
|
||||
toJump("/team-manage/team-center");
|
||||
};
|
||||
|
||||
const isRenderBtn = computed(() => {
|
||||
// return currentPath.value.includes('design')
|
||||
return (
|
||||
route.matched.some((item) => item.meta?.showPublish) &&
|
||||
(store.state.common.surveyStatus !== 1 || route.path !== "/survey/planet/answer-setting")
|
||||
);
|
||||
});
|
||||
|
||||
const showPreview = computed(() => {
|
||||
return route.matched.some((item) => item.meta?.showPreview);
|
||||
});
|
||||
|
||||
const showDownload = computed(() => {
|
||||
return route.matched.some((item) => item.meta?.showDownload);
|
||||
});
|
||||
|
||||
const showShare = computed(() => {
|
||||
return route.matched.some((item) => item.meta?.showShare);
|
||||
});
|
||||
|
||||
const showPublish = computed(() => {
|
||||
return store.state.common.surveyStatus;
|
||||
});
|
||||
|
||||
const showLoading = computed(() => {
|
||||
if (store.state.common.websocket.param !== undefined) {
|
||||
return !store.state.common.websocket.param.is_cache;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
const toPage = (path, title) => {
|
||||
router.push({
|
||||
path,
|
||||
query: route.query,
|
||||
});
|
||||
document.title = title;
|
||||
};
|
||||
|
||||
const toPreview = () => {
|
||||
router.push({
|
||||
path: "/preview",
|
||||
query: route.query,
|
||||
});
|
||||
document.title = name;
|
||||
};
|
||||
|
||||
const openPublishModal = () => {
|
||||
//console.log();
|
||||
// return;
|
||||
let isFb = true;
|
||||
let content = "";
|
||||
const qSteams = [];
|
||||
let type = 0;
|
||||
let title = "推荐提示";
|
||||
store.state.common.questionInfo.questions &&
|
||||
store.state.common.questionInfo.questions.forEach((s) => {
|
||||
if (s.question_type === 105 && s.config.design_version <= 0) {
|
||||
isFb = false;
|
||||
content = createVNode(<div>maxdiff未生成设计，请先进行生成设计才能进行发布</div>);
|
||||
title = "推荐提示";
|
||||
type = 1;
|
||||
}
|
||||
if (s.question_type === 25 || s.question_type === 26) {
|
||||
if ((s.options?.[0]?.length || 0) <= 0 && (s?.associate?.length || 0) <= 0) {
|
||||
isFb = false;
|
||||
qSteams.push(`(${s.title})`);
|
||||
type = 2;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (isFb === true) {
|
||||
visible.value = true;
|
||||
} else {
|
||||
if (type === 2) {
|
||||
const titleStr = qSteams.join(",");
|
||||
title = "添加选区";
|
||||
content = createVNode(<div>{titleStr} 未添加选区，请添加选区后进行发布</div>);
|
||||
}
|
||||
Modal.confirm({
|
||||
title: title,
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: content,
|
||||
onOk () { },
|
||||
width: "640px",
|
||||
height: "364px",
|
||||
onCancel () { },
|
||||
class: "test",
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const handlePublish = () => {
|
||||
publishSurvey({
|
||||
sn,
|
||||
publish_type,
|
||||
}).then((res) => {
|
||||
visible.value = false;
|
||||
store.commit("common/M_COMMON_SET_SURVEY_STATUS", 1);
|
||||
router.push({
|
||||
path: "/survey/publish",
|
||||
query: {
|
||||
sn,
|
||||
is_publish: true, //添加标识
|
||||
},
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const backHome = () => {
|
||||
router.push("/home");
|
||||
document.title = "智能调研工具";
|
||||
};
|
||||
|
||||
const fetchInfo = () => {
|
||||
getSurveyInfo(sn).then((res) => {
|
||||
project_name.value = res.data.project_name;
|
||||
store.commit("common/M_COMMON_SET_SURVEY_NAME", res.data.project_name);
|
||||
store.commit("common/M_COMMON_SET_SURVEY_STATUS", res.data.status);
|
||||
});
|
||||
};
|
||||
|
||||
const visibleShare = ref(false);
|
||||
// 展示分享入口
|
||||
const clickEntrance = () => {
|
||||
console.log("展示入口");
|
||||
visibleShare.value = true;
|
||||
};
|
||||
const groupInfo = ref(null);
|
||||
|
||||
const downloadVisible = ref(false);
|
||||
// 下载中心
|
||||
const toDownload = () => {
|
||||
console.log("下载中心");
|
||||
store.dispatch('downloadCenter/changeCenterUrl', route.path)
|
||||
downloadVisible.value = true
|
||||
// router.push({
|
||||
// path: "/downloadCenter",
|
||||
// query: { path: route.path, sn },
|
||||
// });
|
||||
};
|
||||
onMounted(() => {
|
||||
fetchInfo();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.header {
|
||||
box-sizing: border-box;
|
||||
padding: 0 34px;
|
||||
height: 70px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.06);
|
||||
.left,
|
||||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 40%;
|
||||
.question-name {
|
||||
margin-left: 17px;
|
||||
font-size: 16px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #434343;
|
||||
}
|
||||
.icon-xiangzuo-moren {
|
||||
cursor: pointer;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
.tab-container {
|
||||
width: 60%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.tab-item {
|
||||
position: relative;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
color: #434343;
|
||||
white-space: nowrap;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
cursor: pointer;
|
||||
&.active {
|
||||
font-size: 20px;
|
||||
color: #70b936;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
.click {
|
||||
width: 16px;
|
||||
line-height: 16px;
|
||||
border-radius: 8px;
|
||||
background-color: #70b936;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
.click2 {
|
||||
width: 16px;
|
||||
line-height: 16px;
|
||||
border-radius: 8px;
|
||||
background-color: #f5f5f5;
|
||||
color: black;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.preview-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
color: #646a73;
|
||||
cursor: pointer;
|
||||
}
|
||||
.preview-btn:hover {
|
||||
color: #70b936;
|
||||
}
|
||||
.publish-btn {
|
||||
margin-left: 32px;
|
||||
width: 88px;
|
||||
height: 36px;
|
||||
line-height: 18px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.download-btn {
|
||||
margin-left: 32px;
|
||||
// width: 88px;
|
||||
height: 36px;
|
||||
line-height: 18px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.share-button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
.head-portrait {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
background: #70b936;
|
||||
border-radius: 50%;
|
||||
opacity: 1;
|
||||
margin-left: 32px;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
font-family: PingFang SC-中粗体, PingFang SC;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
}
|
||||
&::v-deep .ant-dropdown-menu-item {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-dropdown-menu {
|
||||
margin: 0;
|
||||
}
|
||||
.ant-dropdown-placement-bottomRight {
|
||||
height: 398px;
|
||||
}
|
||||
.head-portrait-menu {
|
||||
width: 360px;
|
||||
height: 398px;
|
||||
margin-top: 26px;
|
||||
.wai {
|
||||
width: auto;
|
||||
// height: 398px;
|
||||
.one {
|
||||
width: 296px;
|
||||
height: 124px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
margin-left: 32px;
|
||||
display: flex;
|
||||
.leftt {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 50%;
|
||||
background: #70b936;
|
||||
opacity: 1;
|
||||
margin-top: 32px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
color: #fff;
|
||||
}
|
||||
.rightt {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-left: 12px;
|
||||
margin-top: 39px;
|
||||
.wenzi {
|
||||
font-size: 16px;
|
||||
font-family: PingFang SC-中粗体, PingFang SC;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
.two {
|
||||
width: 296px;
|
||||
height: 124px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
margin-left: 32px;
|
||||
overflow: hidden;
|
||||
.homepage {
|
||||
font-size: 16px;
|
||||
margin-top: 32px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.team-members {
|
||||
font-size: 16px;
|
||||
margin-top: 32px;
|
||||
// margin-bottom: 16px;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
.three {
|
||||
width: 296px;
|
||||
height: 124px;
|
||||
margin-left: 32px;
|
||||
// overflow: hidden;
|
||||
.switch-team {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 16px;
|
||||
margin-top: 32px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.log-out {
|
||||
font-size: 16px;
|
||||
margin-top: 32px;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tips {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.icon-tixing {
|
||||
margin-right: 8px;
|
||||
color: #fbad13;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
margin-top: 12px;
|
||||
}
|
||||
.big_box {
|
||||
width: 100%;
|
||||
height: calc(100% + 70px);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
// background-color: #000;
|
||||
}
|
||||
.iconfont {
|
||||
transform-origin: right;
|
||||
}
|
||||
.icon-chexiao {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
.download_img {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
}
|
||||
.click {
|
||||
width: 18px;
|
||||
line-height: 18px;
|
||||
border-radius: 9px;
|
||||
background-color: #70b936;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.click2 {
|
||||
width: 18px;
|
||||
line-height: 18px;
|
||||
border-radius: 9px;
|
||||
background-color: #f5f5f5;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user