hz/ylst-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 投放

Browse Source
This commit is contained in:
liu.huiying@ebiz-digits.com
2025-03-14 10:57:31 +08:00
parent 1a05cb6262
commit 6451387006
6 changed files with 670 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
index.html
View File

@@ -4,6 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="referrer" content="no-referrer" />
<title>Vite App</title> <title>Vite App</title>
</head> </head>
<body> <body>

20
src/api/common/index.js
View File

@@ -1,10 +1,22 @@
import request from '@/utils/request.js'; import request from '@/utils/request.js';
// 校验token返回用户信息 // 校验token返回用户信息
export function getUserInfo(params) { export function getUserInfo(appToken) {
return request({ return request({
url: '/thirdPartyInterfaceInfoEx/test', url: `/open/digital_yili/${appToken}`,
method: 'get', method: 'get'
params });
}
/*
根据员工号查询用户信息
header里传个digitalYiliToken
*/
export function getByCodeInfo(userCode, digitalYiliToken) {
return request({
url: `/open/digital_yili/user/${userCode}`,
headers: {
digitalYiliToken: digitalYiliToken || ''
},
method: 'get'
}); });
} }

45
src/api/publish/index.js Normal file
View File

@@ -0,0 +1,45 @@
import request from '@/utils/request';
// 投放问卷
export function publishSurvey(data) {
return request({
url: `/console/survey_publishes`,
method: 'post',
data
});
}
// 问卷详情
export function getSurveyInfo(sn) {
return request({
url: `/console/surveys/${sn}`,
method: 'get'
});
}
// 查看二维码
export function getQrcode(sn) {
return request({
url: `/console/survey_publishes/${sn}/qrcode`,
method: 'get'
});
}
// 获取问卷测试是否弹层
export function getCheckSurvey(sn) {
return request({
url: `/console/check_survey_test/${sn}`,
method: 'get'
});
}
/* 获取问题列表 */
export function getQuestionList(params, code) {
return request({
headers: {
'survey-invite-code': code || ''
},
url: `/console/surveys/${params}/questions`,
method: 'get'
});
}

BIN
src/assets/img/publish/not_pulish.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 277 KiB

471
src/layouts/utils.js Normal file
View File

@@ -0,0 +1,471 @@
// import { getQuesByPages } from '@/views/planetDesign/Design/js/util';
// import { A_COMMON_SET_ACTIVEQUESTION } from '@store/constance/constance.common'
import { createVNode } from 'vue';
import { showConfirmDialog, showDialog } from 'vant';
import { getQuestionList, getCheckSurvey } from '@/api/publish';
// import store from '@/store';
// import Scroll from '@views/planetDesign/Design/js/scroll'
// /**
// * 统一的弹窗
// * @param options
// */
/**
* 统一的弹窗
* @param options
*/
function showModal(options) {
const confirm = (...rest) => {
if (options.incompleteQuestionList?.length) {
if (options.onOk) {
options.onOk(...rest);
}
// const firstQuestion = options.incompleteQuestionList[0];
// store.commit(`common/${A_COMMON_SET_ACTIVEQUESTION}`, JSON.stringify(firstQuestion));
// const el = document.getElementById(firstQuestion.id);
// new Scroll(el).animate();
}
};
showConfirmDialog({
class: 'custom-modal custom-modal-title-notice',
title: '提示',
icon: null,
...options
})
.then(() => {
confirm();
})
.catch(() => {});
}
/**
* PSM的判断
* @param {*} data
* @returns
*/
const canPlanetPublishPSM = function(data) {
let isFb = true;
let content = '';
let title = '题目设置未完成';
const incompleteQuestionList = [];
data.questions
&& data.questions.forEach((s) => {
if (s.question_type === 101 && s.config.price_gradient.length <= 0) {
isFb = false;
content = 'psm题目未完成设置，请设置价格区间后投放';
title = '题目设置未完成';
incompleteQuestionList.push(s);
}
});
if (isFb === true) {
return true;
} else {
const titleStr = incompleteQuestionList.map((item) => item.title).join('、') || '';
showModal({
title,
content: `${titleStr} ${content}`,
incompleteQuestionList
});
}
};
/**
* Mxd和热区的判断
* @param {*} data
* @returns
*/
const canPlanetPublishMxdAndHotArea = function(data) {
let isFb = true;
let content = '';
const qSteams = [];
const incompleteQuestionList = [];
let type = 0;
let title = '题目设置未完成';
data.questions
&& data.questions.forEach((s) => {
if (s.question_type === 105 && s.config.design_version <= 0) {
isFb = false;
content = 'maxdiff题目未完成设置，请生成设计后投放';
title = '题目设置未完成';
type = 1;
incompleteQuestionList.push(s);
}
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;
incompleteQuestionList.push(s);
}
}
});
if (isFb === true) {
return true;
} else {
if (type === 2) {
const titleStr = qSteams.join(',');
title = '添加选区';
content = `${titleStr} 未添加选区，请添加选区后进行投放`;
}
showModal({
title,
content,
incompleteQuestionList
});
}
};
/**
* 3D相关的判断
* @param {*} data
* @returns
*/
const canPlanetPublish3D = function(data) {
{
let canFB = true;
let content = '';
const qSteams = [];
let title = '';
data.questions
&& data.questions.forEach((s) => {
if (QUESTION_TYPE.contains(s.question_type)) {
try {
if (s.config.is_three_dimensions && !s.config.scene) {
canFB = false;
qSteams.push(`(${s.title})`);
}
} catch (error) {
console.warn(error);
}
}
});
if (!canFB === true) {
const titleStr = qSteams.join(',');
title = '选择场景';
content = `${titleStr} 未选择场景，请选择场景后进行投放`;
showModal({
title,
content
});
return;
}
}
{
let canFB = true;
let content = '';
const qSteams = [];
let title = '';
data.questions
&& data.questions.forEach((s) => {
if (QUESTION_TYPE.contains(s.question_type)) {
try {
if (s.config.is_three_dimensions && s.config.is_binding_goods) {
const wares = [];
const scene_information = s.config.scene_information;
const sceneInformation
= typeof scene_information === 'string'
? JSON.parse(scene_information)
: scene_information;
sceneInformation.shelves.forEach((shelf) => {
shelf.wares.forEach((ware) => {
if (!ware.option_index) return;
wares.push(ware);
});
});
const options = s.options.flat();
s.associate.forEach((ass) => {
const question = data.questions.find((q) => q.question_index == ass.question_index);
if (!question) return;
options.push(...question.options.flat());
});
// options = options.filter(option => !option.is_other);
// 判定是否有选项未关联商品
if (options.length > wares.length) {
canFB = false;
qSteams.push(`(${s.title})`);
}
}
} catch (error) {
console.warn(error);
}
}
});
if (!canFB === true) {
const titleStr = qSteams.join(',');
title = '商品关联选项';
content = `${titleStr} 仍有选项未关联商品，无法进行投放`;
showModal({
title,
content
});
return;
}
}
return true;
};
/**
* 图片题的判断
* @param {*} data
* @returns
*/
const canPlanetPublishImage = function(data) {
{
let canFB = true;
let content = '';
const qSteams = [];
let title = '';
data.questions
&& data.questions.forEach((s) => {
if (s.question_type == 13) {
try {
if (s.options.length <= 0 || s.options.some((y) => y.length <= 0)) {
canFB = false;
qSteams.push(`(${s.title})`);
}
} catch (error) {
console.warn(error);
}
}
});
if (!canFB === true) {
const titleStr = qSteams.join(',');
title = '题目设置未完成';
// content = `${titleStr} 未上传图片，请上传图片后进行投放`;
content = `图片题 ${titleStr} 未上传图片，请设置后投放`;
showModal({
title,
content
});
return;
}
}
return true;
};
/**
* 多项填空题
* @param data
* @param publishType
*/
function canPublishMultiCompletion(data, publishType) {
const publishStr = ['', '预览', '投放'][publishType] || '投放';
const questions = [];
if (!data?.questions?.length) {
return true;
}
data.questions.forEach((quiz) => {
if (quiz.question_type !== 27) {
return;
}
if (!getDomText(quiz.config?.text_content)) {
questions.push(quiz.title);
}
});
if (questions.length) {
showModal({
title: '题目设置未完成',
content: `多项填空题 (${questions.join('、')}) 未设置填空，请设置后${publishStr}`
});
return false;
}
return true;
}
/**
* 校验 “逻辑 -> 随机列表” 是否满足投放条件
* @param data
* @return {boolean}
*/
function canPublishRandom(data, publishType) {
const publishStr = ['', '预览', '投放'][publishType] || '投放';
const errors = [];
const randomList = data?.survey?.group_pages || [];
randomList.forEach((random, randomIndex) => {
const list = random.list || [];
// 每一个随机，至少要有两个随机题组
if (list.length < 2) {
errors.push({ message: `“${random.title}”需至少配置2个“随机题组”` });
return false;
}
list.forEach((item, index) => {
// 这三个是必填的
const fields = [
{ label: 'title', name: '题组名称', validator: (value) => !!value },
{ label: 'start', name: '题组起点', validator: (value) => !!value },
{ label: 'end', name: '题组终点', validator: (value) => !!value }
];
fields.forEach((field) => {
const isValidated = field.validator(item[field.label]);
if (!isValidated) {
errors.push({
message:
field.message
|| `请填写“${random.title}”中第${index + 1}组“随机题组”的“${field.name}”`
});
}
});
});
});
if (errors.length) {
showModal({
title: '修改随机题组',
content: `随机题组设置不完全，请前往“逻辑设置-随机列表”修改后${publishStr}`
});
return false;
}
return true;
}
/**
* 循环逻辑的判断
* @param data
* @param publishType
*/
function isLoopingLogicValid(data, publishType) {
const publishStr = ['', '预览', '投放'][publishType] || '投放';
if (
(data?.cycle_pages || []).every((i) => {
return (
i.question_index
&& i.relation_type !== undefined
&& i.relation_type !== null
&& i.first_page
&& i.last_page
);
})
) {
return loopingAvailable({
cycles: data.cycle_pages || [],
questions: getQuesByPages(data.questions || [], data.survey.pages),
logics: data.logics || [],
isPerPage: data.survey?.is_one_page_one_question
});
}
showDialog({
class: 'custom-modal custom-modal-title-notice show-icon',
title: '修改循环',
content: `循环题组不完全，请前往循环列表修改后${publishStr}`
});
return false;
}
export const canPlanetPublish = async function(sn, publishType) {
const parsedPublishType = !publishType ? 2 : publishType;
const num = window.location.href.indexOf('code=');
let code;
if (num > -1) {
code = window.location.href.slice(num + 5, window.location.href.length);
} else {
code = '';
}
const { data } = await getQuestionList(sn, code);
if (!canPlanetPublishPSM(data)) return false;
if (!canPlanetPublishMxdAndHotArea(data)) return false;
if (!canPlanetPublish3D(data)) return false;
if (!canPlanetPublishImage(data)) return false;
if (!canPublishMultiCompletion(data, parsedPublishType)) return false;
if (!canPublishRandom(data, parsedPublishType)) return false;
// if (!isLoopingLogicValid(data, parsedPublishType)) return false;
if (parsedPublishType === 2) {
const qrcodeRes = await getCheckSurvey(sn);
if (qrcodeRes?.data?.show_test_button) {
const res = await new Promise((resolve) => {
showConfirmDialog({
class: 'custom-modal custom-modal-title-confirm-notice show-icon',
title: '确认要投放这个问卷吗?',
// content: () =>
// createVNode('div', {}, [
// createVNode(
// 'div',
// {
// style: {
// position: 'absolute',
// top: '0',
// right: '0',
// display: 'flex',
// justifyContent: 'center',
// alignItems: 'center',
// width: '56px',
// height: '56px',
// fontSize: '14px',
// cursor: 'pointer'
// },
// onClick: () => {
// console.log('close');
// modal.destroy();
// resolve(false);
// }
// },
// // 使用 HTML 实体 &times; 来替代 ant - design 的 CloseOutlined
// ['&times;']
// ),
// createVNode(
// 'div',
// {},
// '投放前测试能帮助您确认问卷设计逻辑及作答数据是否正确，避免因问卷设计问题造成重大损失。'
// )
// ]),
contentStyle: {
position: 'absolute',
top: '0',
right: '0',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '56px',
height: '56px',
fontSize: '14px',
cursor: 'pointer'
},
message:
'投放前测试能帮助您确认问卷设计逻辑及作答数据是否正确，避免因问卷设计问题造成重大损失。',
confirmButtonText: '去测试',
onConfirm() {
resolve(false);
// window.open(`${location.origin}/#/answer?sn=${sn}&is_test=1`);
},
width: '640px',
height: '364px',
cancelButtonText: '继续投放',
onCancel() {
resolve(true);
},
dialogStyle: {
fontSize: '44px'
},
zIndex: 9999999
});
});
if (!res) return;
}
}
return true;
};

191
src/views/Survey/views/Publish/Index.vue
View File

@@ -1,79 +1,84 @@
<template> <template>
<div class="container"> <div class="container">
<van-nav-bar :title="surveyTitle" left-arrow @click-left="$router.go(-1)" /> <van-nav-bar :title="surveyTitle" left-arrow @click-left="$router.go(-1)" />
<div class="content">
<van-cell-group inset style="margin-top: 20px; padding: 30px"> <!-- <van-cell-group v-if="status === 1" inset style="padding-top: 15px"> -->
<div> <van-cell-group inset style="padding-top: 15px">
<img <div>
width="100%"
src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u14.jpg?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
alt=""
/>
</div>
<div class="qrcode">
<img :src="publishInfo.img_url" alt="" width="100px" height="100px" />
<div class="tit">
<div>液态奶产品研究标准化问卷</div>
<div>扫码填写问卷</div>
</div>
</div>
<div>移动端仅做数据回收，问卷数据分析请前往PC端浏览</div>
<div class="operation">
<span v-for="(item, index) in operateList" :key="index" @click="operateBtn(item)">
<img <img
width="30px" width="100%"
src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333" src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u14.jpg?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
alt=""
/> />
{{ item.title }} </div>
</span> <div class="qrcode">
</div> <img :src="publishInfo.img_url" alt="" width="100px" height="100px" />
</van-cell-group> <div class="tit">
<!-- 底部功能性按钮 --> <div>液态奶产品研究标准化问卷</div>
<div <div>扫码填写问卷</div>
style=" </div>
position: fixed; </div>
bottom: 0; <div style="color: #7f7f7f">移动端仅做数据回收，问卷数据分析请前往PC端浏览</div>
display: flex; <div class="operation">
flex-direction: row; <span v-for="(item, index) in operateList" :key="index" @click="operateBtn(item)">
align-items: center; <img width="30px" :src="item.icon" />
justify-content: space-around; {{ item.title }}
width: 100%; </span>
height: 50px; </div>
background-color: white; </van-cell-group>
" <!-- <div v-if="status === 0 || status === 2" class="pulish-container">
></div> <img class="not-publish-icon" src="@/assets/img/publish/not_pulish.png" alt="" />
<div class="text">点击"启用"按钮后，问卷才可以开始回收数据</div>
<van-button type="primary" style="margin-top: 20px" class="publish-btn" color="#70b936"
@click="openPublishModal">
<template #icon>
<i class="iconfont icon-fabu3" style="margin-right: 6px"></i>
</template>
启用
</van-button>
</div> -->
</div>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { onMounted, reactive, ref } from 'vue'; import { onMounted, reactive, ref, watch } from 'vue';
import { showFailToast, showSuccessToast } from 'vant'; import { showFailToast, showSuccessToast, showConfirmDialog } from 'vant';
import utils from '@/assets/js/common'; import utils from '@/assets/js/common';
import appBridge from '@/assets/js/appBridge'; import appBridge from '@/assets/js/appBridge';
import { getQrcode } from '@/api/survey'; import { getSurveyInfo, getQrcode, publishSurvey } from '@/api/publish';
import { canPlanetPublish } from '@/layouts/utils.js';
import configUrl from '../../../../config';
const route = useRoute(); const route = useRoute();
const surveyTitle = route.meta.title as string; const surveyTitle = route.meta.title as string;
appBridge.setTitle(surveyTitle); appBridge.setTitle(surveyTitle);
const sn = route.query.sn;
const status = ref<number>(0); // `0`: 编辑中 `1`: 投放中 `2`: 已结束
const publish_type = ref(0);
const operateList = reactive([ const operateList = reactive([
{ {
title: '复制链接', title: '复制链接',
type: 'copyLink' type: 'copyLink',
icon: 'https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333'
}, },
{ {
title: '转发到微信', title: '转发到微信',
type: 'shareLink' type: 'shareLink',
icon: 'https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333'
}, },
{ {
title: '下载二维码', title: '下载二维码',
type: 'qrCode' type: 'qrCode',
icon: 'https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333'
} }
]); ]);
interface PublishInfo { interface PublishInfo {
download_url: { download_url: {
title: string; title: string;
url: string;
}; };
desc?: string; desc?: string;
img_url: string; img_url: string;
@@ -81,10 +86,39 @@ interface PublishInfo {
} }
const publishInfo = ref<PublishInfo>({} as PublishInfo); const publishInfo = ref<PublishInfo>({} as PublishInfo);
type OperateItem = (typeof operateList)[0]; type OperateItem = (typeof operateList)[0];
onMounted(async() => { function handlePublish() {
getQrcode('Xxgdr5EN') publishSurvey({
sn,
publish_type: publish_type.value
})
.then(() => {
// store.commit('common/M_COMMON_SET_SURVEY_STATUS', 1);
fetchInfo();
})
.catch(() => {
// emitter.emit('app-loading', false);
});
}
async function openPublishModal() {
const res = await canPlanetPublish(route.query.sn);
// if (res) {
// handlePublish();
// } else {
// emitter.emit('app-loading', false);
// }
}
function getCode() {
console.log(56, configUrl.proxyUrl);
publishInfo.value.img_url = 'https://test-cxp-pubcos.yili.com/uat-yls//survey-api/publish/202503130938138261340.png';
publishInfo.value.url = `${configUrl.proxyUrl}publish?sn=${sn && sn != undefined ? sn : ''}`;
publishInfo.value.download_url = {
title: '问卷下载',
url: 'https://test-cxp-pubcos.yili.com/uat-yls//survey-api/publish/202503130938138261340.png'
};
getQrcode(sn)
.then((res) => { .then((res) => {
if (res.data) { if (res.data) {
publishInfo.value = res.data.data || {}; publishInfo.value = res.data.data || {};
@@ -94,6 +128,22 @@ onMounted(async() => {
.catch((error) => { .catch((error) => {
showFailToast(error.data?.message || error.message || '服务器错误'); showFailToast(error.data?.message || error.message || '服务器错误');
}); });
}
function fetchInfo() {
getSurveyInfo(sn)
.then((res) => {
status.value = Number(res.data.data.status);
})
.finally(() => { });
}
watch(status, (val) => {
if (val === 1) {
getCode();
}
});
onMounted(async() => {
// fetchInfo();
getCode();
}); });
const operateBtn = (item: OperateItem) => { const operateBtn = (item: OperateItem) => {
switch (item.type) { switch (item.type) {
@@ -130,9 +180,7 @@ function shareLink() {
webpageUrl: publishInfo.value.url, webpageUrl: publishInfo.value.url,
scene: 0 // 朋友圈1 微信好友0 scene: 0 // 朋友圈1 微信好友0
}; };
appBridge.shareToWeChat(params, () => { appBridge.shareToWeChat(params, () => { });
// console.log('分享结果:', result);
});
} }
// 下载二维码 // 下载二维码
@@ -140,7 +188,7 @@ function downLoadImg() {
const { title, url } = publishInfo.value.download_url; const { title, url } = publishInfo.value.download_url;
if (utils.getCookie('xToken')) { if (utils.getCookie('xToken')) {
appBridge.save2Album(url, () => { appBridge.save2Album(url, () => {
showSuccessToast('下载成功'); // showSuccessToast('下载成功');
}); });
} else { } else {
const link = document.createElement('a'); const link = document.createElement('a');
@@ -173,11 +221,19 @@ function downLoadImg() {
} }
} }
.content {
margin: 10px 15px;
padding-bottom: 30px;
border-radius: 3px;
background: #fff;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
}
.qrcode { .qrcode {
display: flex; display: flex;
margin: 10px 0; margin: 10px 0;
.tit{ .tit {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
@@ -198,9 +254,36 @@ function downLoadImg() {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
img{ img {
margin-bottom: 10px; margin-bottom: 10px;
} }
} }
} }
.pulish-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 50vh;
padding: 24px 32px 28px;
.not-publish-icon {
width: 150px;
height: 150px;
}
.text {
margin-top: 20px;
color: #70b936;
font-size: 14px;
}
}
.publish-btn {
display: flex;
align-items: center;
height: 32px;
border-radius: 4px;
}
</style> </style>