feat:app嵌套h5

This commit is contained in:
liu.huiying@ebiz-digits.com
2025-03-12 15:45:26 +08:00
parent 5dd48c6a94
commit d05cc14ff3
13 changed files with 242 additions and 2182 deletions

View File

@@ -1,10 +1,9 @@
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
}); });
} }

View File

@@ -19,7 +19,7 @@ export function sync(params) {
method: 'get' method: 'get'
}); });
} }
export function saveQuestions(params) { export function questionDetails(params) {
// let sn = params.sn; // let sn = params.sn;
// delete params.sn; // delete params.sn;
return request({ return request({

View File

@@ -17,9 +17,7 @@ export default {
_string2json(value) { _string2json(value) {
try { try {
value = JSON.parse(value); value = JSON.parse(value);
} catch (e) { } catch (e) {}
// 以后再说
}
return value; return value;
}, },

File diff suppressed because it is too large Load Diff

View File

@@ -15,11 +15,6 @@
:index="index" :index="index"
:chooseQuestionId="chooseQuestionId" :chooseQuestionId="chooseQuestionId"
@get-choose-question-id="getChooseQuestionId" @get-choose-question-id="getChooseQuestionId"
@move="emitFun.move"
@copy="emitFun.copy"
@delete="emitFun.delete"
@setting="emitFun.setting"
@logics="emitFun.logics"
> >
<!-- 选择题 --> <!-- 选择题 -->
<Choice <Choice
@@ -108,8 +103,6 @@
</div> </div>
</template> </template>
</choose-question> </choose-question>
<!-- 增加控制按钮-->
<slot name="button" :item="element"></slot>
<!-- {{ element.question_type }}--> <!-- {{ element.question_type }}-->
<!-- {{questionInfo.survey.pages.length}}--> <!-- {{questionInfo.survey.pages.length}}-->
@@ -128,12 +121,9 @@
</template> </template>
<script setup> <script setup>
import { v4 as uuidv4 } from 'uuid'; import { v4 as uuidv4 } from 'uuid';
import * as Base64 from 'js-base64';
import { ref, onMounted, watch, computed } from 'vue'; import { ref, onMounted, watch, computed } from 'vue';
import { useCounterStore } from '@/stores/counter'; import { useCounterStore } from '@/stores/counter';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useRoute } from 'vue-router';
import { saveQuestion, sync } from '@/api/design/index.js';
import Draggable from './components/Draggable.vue'; import Draggable from './components/Draggable.vue';
import Choice from './components/Questions/Choice.vue'; import Choice from './components/Questions/Choice.vue';
import ChooseQuestion from './components/ChooseQuestion.vue'; import ChooseQuestion from './components/ChooseQuestion.vue';
@@ -145,10 +135,9 @@ import TextWithImages from '@/views/Design/components/Questions/TextWithImages.v
import SignQuestion from './components/Questions/SignQuestion.vue'; import SignQuestion from './components/Questions/SignQuestion.vue';
import FileUpload from './components/Questions/FileUpload.vue'; import FileUpload from './components/Questions/FileUpload.vue';
import NPS from '@/views/Design/components/Questions/NPS.vue'; import NPS from '@/views/Design/components/Questions/NPS.vue';
import { getPages } from '@/utils/public.js';
const activeIndex = ref(-1); const activeIndex = ref(-1);
const route = useRoute();
// 获取所有的 question 列表内容 // 获取所有的 question 列表内容
const { filterGap, activeId } = defineProps({ const { filterGap, activeId } = defineProps({
filterGap: { filterGap: {
@@ -306,47 +295,6 @@ const actionFun = {
} }
}; };
// emit 事件
const saveQueItem = (logics, questions, survey) => {
saveQuestion({
sn: route.query.sn,
data: {
logics: logics || [],
questions: questions || [],
survey: {
local_pages: [],
...survey,
pages: getPages(
questionInfo.value.questions,
questionInfo.value.survey.is_one_page_one_question
),
version: Base64.encode(`${new Date().getTime()}`)
}
}
}).then(() => {
sync({ sn: route.query.sn });
});
};
const emitFun = {
move: () => {
saveQueItem();
},
copy: (item) => {
saveQueItem(null, [item]);
},
delete: () => {
saveQueItem();
},
// 右下角操作
setting: (item) => {
saveQueItem(null, [item]);
},
logics: (item) => {
saveQueItem(questionInfo.value.logics, [item]);
}
};
onMounted(() => { onMounted(() => {
questionInfo.value = store.questionsInfo.value; questionInfo.value = store.questionsInfo.value;
}); });

View File

@@ -19,7 +19,6 @@
size="0.5rem" size="0.5rem"
:active-value="1" :active-value="1"
:inactive-value="0" :inactive-value="0"
@change="saveSettings"
></van-switch> ></van-switch>
</template> </template>
</van-cell> </van-cell>
@@ -35,7 +34,6 @@
size="0.5rem" size="0.5rem"
:active-value="1" :active-value="1"
:inactive-value="0" :inactive-value="0"
@change="saveSettings"
></van-switch> ></van-switch>
</template> </template>
</van-cell> </van-cell>
@@ -55,7 +53,6 @@
<checkbox-question-action <checkbox-question-action
v-if="activeQuestion.question_type === 2" v-if="activeQuestion.question_type === 2"
v-model="activeQuestion" v-model="activeQuestion"
@save-option="saveSettings"
></checkbox-question-action> ></checkbox-question-action>
<rate-action <rate-action
v-if="activeQuestion.question_type === 5" v-if="activeQuestion.question_type === 5"
@@ -89,7 +86,6 @@
close-icon="close" close-icon="close"
round round
:style="{ minHeight: '50%', maxHeight: '75%' }" :style="{ minHeight: '50%', maxHeight: '75%' }"
@close="saveLogics"
> >
<div class="mv10"> <div class="mv10">
<header> <header>
@@ -136,19 +132,10 @@ const props = defineProps({
} }
}); });
const questions = ref(props.questions); const questions = ref(props.questions);
// emit
const emit = defineEmits(['move', 'copy', 'delete', 'setting', 'logics']);
const saveSettings = () => {
emit('setting', activeQuestion.value);
};
const saveLogics = () => {
emit('logics', activeQuestion.value);
};
// 当前题目 // 当前题目
const activeQuestion = ref(props.data); const activeQuestion = ref(props.data);
// 设置更新
const show = ref(false); const show = ref(false);
const questionShow = ref(false); const questionShow = ref(false);
const questionBeforeShow = ref(false); const questionBeforeShow = ref(false);
@@ -164,9 +151,7 @@ const deleteQuestion = () => {
}) })
.then(() => { .then(() => {
// on confirm // on confirm
const index = props.questionIndex;
questions.value.splice(props.questionIndex, 1); questions.value.splice(props.questionIndex, 1);
emit('delete', index);
}) })
.catch(() => { .catch(() => {
// on cancel // on cancel
@@ -190,8 +175,6 @@ const questionMove = (action) => {
const temp = questions.value[props.questionIndex]; const temp = questions.value[props.questionIndex];
questions.value.splice(props.questionIndex, 1); questions.value.splice(props.questionIndex, 1);
questions.value.splice(props.questionIndex + 1, 0, temp); questions.value.splice(props.questionIndex + 1, 0, temp);
emit('move', 'down');
} else if (action.action === 'up') { } else if (action.action === 'up') {
if (props.questionIndex === 0) { if (props.questionIndex === 0) {
return; return;
@@ -199,21 +182,15 @@ const questionMove = (action) => {
const temp = questions.value[props.questionIndex]; const temp = questions.value[props.questionIndex];
questions.value.splice(props.questionIndex, 1); questions.value.splice(props.questionIndex, 1);
questions.value.splice(props.questionIndex - 1, 0, temp); questions.value.splice(props.questionIndex - 1, 0, temp);
emit('move', 'up');
} else { } else {
// 复制 题目 生成新的id 更新最新的 last index // 复制 题目 生成新的id 更新最新的 last index
const temp = questions.value[props.questionIndex]; const temp = questions.value[props.questionIndex];
questions.value.splice(props.questionIndex + 1, 0, {
const newQuestion = {
...temp, ...temp,
id: uuidv4(), id: uuidv4(),
question_index: questionsInfo.value.survey.last_question_index + 1 question_index: questionsInfo.value.survey.last_question_index + 1
}; });
questions.value.splice(props.questionIndex + 1, 0, newQuestion);
questionsInfo.value.survey.last_question_index += 1; questionsInfo.value.survey.last_question_index += 1;
emit('copy', newQuestion);
questionShow.value = false;
} }
}; };
@@ -253,7 +230,6 @@ const questionSetting = (type) => {
const updateConfig = (value) => { const updateConfig = (value) => {
activeQuestion.value.config = { ...value }; activeQuestion.value.config = { ...value };
saveSettings();
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

View File

@@ -9,7 +9,6 @@
input-align="right" input-align="right"
class="action-field" class="action-field"
placeholder="不限" placeholder="不限"
@blur="emit('saveOption')"
@update:model-value=" @update:model-value="
(value) => { (value) => {
actionQuestion.config.min_select = Number(value); actionQuestion.config.min_select = Number(value);
@@ -28,7 +27,6 @@
placeholder="不限" placeholder="不限"
input-align="right" input-align="right"
class="action-field" class="action-field"
@blur="emit('saveOption')"
@update:model-value=" @update:model-value="
(value) => { (value) => {
actionQuestion.config.max_select = Number(value); actionQuestion.config.max_select = Number(value);
@@ -51,7 +49,7 @@ const props = defineProps({
} }
}); });
const emit = defineEmits(['update:modelValue', 'saveOption']); const emit = defineEmits(['update:modelValue']);
const actionQuestion = computed({ const actionQuestion = computed({
get() { get() {
return props.modelValue; return props.modelValue;

View File

@@ -21,7 +21,6 @@
class="question" class="question"
:options="beforeQuesOptions" :options="beforeQuesOptions"
placeholder="请选择问题" placeholder="请选择问题"
@change="getQuestionType"
></yl-select> ></yl-select>
<!-- 为空 不为空--> <!-- 为空 不为空-->
<yl-select <yl-select
@@ -181,15 +180,13 @@ skipOption.push(
); );
// 题目选项 // 题目选项
let optionOptions = []; let optionOptions = [];
// todo 不同题型逻辑对应不同 需要开发
const changeQuestionIndex = (value, logicItem) => { const changeQuestionIndex = (value, logicItem) => {
console.log(logicItem);
if (!value) { if (!value) {
return []; return [];
} }
beforeQuesOptions.map((item) => { beforeQuesOptions.map((item) => {
if (item.question_index === value) { if (item.question_index === value) {
if ([1, 2].includes(logicItem.question_type)) {
if (logicItem.is_option_group === 0) { if (logicItem.is_option_group === 0) {
optionOptions = item.options[0].map((optItem) => { optionOptions = item.options[0].map((optItem) => {
return { return {
@@ -210,7 +207,6 @@ const changeQuestionIndex = (value, logicItem) => {
optionOptions = []; optionOptions = [];
} }
} }
}
}); });
return optionOptions; return optionOptions;
}; };
@@ -233,7 +229,7 @@ const addLogicItem = (logIndex, item) => {
item.splice(logIndex + 1, 0, { item.splice(logIndex + 1, 0, {
logic: 'and', logic: 'and',
question_index: '', question_index: '',
question_type: 0, question_type: '',
is_answer: 1, is_answer: 1,
operator: '=', operator: '=',
option_index: '', option_index: '',
@@ -249,16 +245,28 @@ const addLogic = () => {
logics.value.push({ logics.value.push({
logic: [ logic: [
{ {
value: '',
location: 0,
date: '',
time: '',
type: 0, type: 0,
row_type: 0,
cell_type: 0,
logic: 'if', logic: 'if',
operator: '=', operator: '=',
is_answer: 1, is_answer: 1,
question_type: 0, is_select: 0,
question_index: 0, row_index: 0,
cell_index: 0,
question_type: '',
question_index: '',
relation_question_index: 0, relation_question_index: 0,
relation_question_row_index: 0, relation_question_row_index: 0,
relation_question_cell_index: 0, relation_question_cell_index: 0,
option_index: 0 is_option_group: '',
option_index: '',
skip_type: null,
question_id: null
} }
], ],
skip_type: props.skipType, skip_type: props.skipType,
@@ -315,12 +323,6 @@ const symbolOptions = [
} }
]; ];
const getQuestionType = (value) => {
console.log(beforeQuesOptions);
const type = beforeQuesOptions.filter((item) => item.question_index === value)[0];
console.log(type);
};
const logicIf = (value, index) => { const logicIf = (value, index) => {
if (value === 'always') { if (value === 'always') {
logics.value[index].logic = [logics.value[index].logic[0]]; logics.value[index].logic = [logics.value[index].logic[0]];

View File

@@ -17,13 +17,20 @@
v-model:data="element" v-model:data="element"
:questions="questions" :questions="questions"
:questionIndex="index" :questionIndex="index"
@move="emit('move', $event)"
@copy="emit('copy', $event)"
@delete="emit('delete', $event)"
@setting="emit('setting', $event)"
@logics="emit('logics', $event)"
></question-action> ></question-action>
</template> </template>
<!-- <div-->
<!-- v-for="item in questionAction"-->
<!-- :key="item.key"-->
<!-- class=""-->
<!-- :class="item.class ? item.class : ''"-->
<!-- @click="itemAction(item)"-->
<!-- >-->
<!-- <i class="icon iconfont choose-question-active-container-icon" v-html="item.icon"></i>-->
<!-- <div class="choose-question-active-container-name">-->
<!-- {{ item.name }}-->
<!-- </div>-->
<!-- </div>-->
</van-cell> </van-cell>
</div> </div>
</div> </div>
@@ -52,14 +59,70 @@ const props = defineProps({
} }
}); });
const element = ref(props.element); const element = ref(props.element);
// 选中题目后出现的操作 // 选中题目后出现的操作
const emit = defineEmits(['getChooseQuestionId', 'move', 'copy']); // const questionAction = ref([
// {
// icon: '&#xe630;',
// name: '编辑',
// key: 'edit',
// class: ''
// },
// {
// icon: '&#xe632;',
// name: '复制',
// key: 'copy',
// class: ''
// },
// {
// icon: '&#xe6a0;',
// name: '移动',
// key: 'moveUp',
// class: 'moverQues'
// },
// // {
// // icon:'',
// // name:'下移',
// // key:'moveDown',
// // class:''
// // },
// {
// icon: '&#xe63f;',
// name: '删除',
// key: 'delete',
// class: ''
// }
// ]);
const emit = defineEmits(['getChooseQuestionId']);
// 选中题目 // 选中题目
const chooseItem = () => { const chooseItem = () => {
// 使用从 defineProps 接收的 element 对象 // 使用从 defineProps 接收的 element 对象
emit('getChooseQuestionId', props.element); emit('getChooseQuestionId', props.element);
}; };
// const itemAction = (item) => {
// switch (item.key) {
// case 'edit':
// // vue router跳转到/edit
//
// router.push({
// path: '/design/edit',
// query: {
// id: props.element.id
// }
// });
// break;
// case 'copy':
// break;
// case 'moveUp':
// break;
// case 'moveDown':
// break;
// case 'delete':
// break;
// }
// };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.choose-question-container { .choose-question-container {

View File

@@ -10,26 +10,15 @@ import { showFailToast } from 'vant';
onMounted(async() => { onMounted(async() => {
if (utils.getParameter('digitalYiliToken')) { if (utils.getParameter('digitalYiliToken')) {
const query = { const appToken = utils.getParameter('digitalYiliToken');
xToken: utils.getParameter('digitalYiliToken') getUserInfo(appToken).then((res) => {
};
getUserInfo(query).then((res) => {
// res = {
// code: 200,
// message: null,
// data: {
// deptName: '总部数字科技中心',
// userName: '黄静',
// userCode: '10046899',
// deptCode: '10001892',
// buName: '总部'
// }
// };
if (res.data) { if (res.data) {
utils.setSessionStorage('userInfo', res.data); utils.setSessionStorage('userInfo', res.data.data);
} else { } else {
showFailToast(error.data?.message || error.message || '服务器错误'); showFailToast(error.response.data?.message || error.data?.message || error.message || '服务器错误');
} }
}).catch((error) => {
showFailToast(error.response.data?.message || error.message || '服务器错误');
}); });
} }
}); });
@@ -52,13 +41,13 @@ onMounted(async() => {
padding: 0 10px 60px; padding: 0 10px 60px;
background: linear-gradient(0deg, #f5f5f5 0%, #f5f5f5 84%, #a5d380 100%); background: linear-gradient(0deg, #f5f5f5 0%, #f5f5f5 84%, #a5d380 100%);
& > :first-child { &> :first-child {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
border-radius: 6px; border-radius: 6px;
background-color: white; background-color: white;
& > div { &>div {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 50px; width: 50px;

View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
// import { ref } from 'vue'; // import { ref } from 'vue';
import { consoleSurveys } from '@/api/home/index.js'; import { consoleSurveys } from '@/api/home/index.js';
import { snQuestions, saveQuestions } from '@/api/design/index.js'; import { snQuestions, questionDetails } from '@/api/design/index.js';
import { surveys } from './Hooks/useRequestHooks'; import { surveys } from './Hooks/useRequestHooks';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useCounterStore } from '@/stores/counter'; import { useCounterStore } from '@/stores/counter';
@@ -11,6 +11,14 @@ const counterStore = useCounterStore();
const store = storeToRefs(counterStore); const store = storeToRefs(counterStore);
const router = useRouter(); const router = useRouter();
// const surveys = ref([]);
//
// getQuestionList({}).then((res) => {
// console.log(res.data.data);
// surveys.value = res.data.data;
// });
console.log(surveys);
const createdQuestion = (item) => { const createdQuestion = (item) => {
const query = { const query = {
@@ -27,7 +35,7 @@ const createdQuestion = (item) => {
if (ques.data) { if (ques.data) {
ques.data.data.survey.introduction = `<p>为优化活动服务品质,烦请完成问卷,感谢配合!您的反馈至关重要!(此提示语为默认提示语,您可选择自行输入本问卷的提示语)</p>`; ques.data.data.survey.introduction = `<p>为优化活动服务品质,烦请完成问卷,感谢配合!您的反馈至关重要!(此提示语为默认提示语,您可选择自行输入本问卷的提示语)</p>`;
store.questionsInfo.value = ques.data.data; store.questionsInfo.value = ques.data.data;
saveQuestions({ questionDetails({
sn: res.data.data.sn, sn: res.data.data.sn,
introduction: ques.data.data.survey.introduction, introduction: ques.data.data.survey.introduction,
title: ques.data.data.survey.title title: ques.data.data.survey.title

View File

@@ -25,23 +25,17 @@
></contenteditable> ></contenteditable>
</div> </div>
<van-button v-if="questionInfo.questions.length === 0" size="small" @click="show = true"> <button v-if="questionInfo.questions.length === 0" @click="show = true">添加题目</button>
添加题目
</van-button>
</div> </div>
</van-cell-group> </van-cell-group>
<div class="ques"> <div class="ques">
<!-- 题目--> <!-- 题目-->
<Design :active-id="activeId" class="design" @get-active-question="getActiveQuestion"> <Design
<template #button="{ item }"> :active-id="activeId"
<div class="design-button"> class="desgin"
<van-button v-if="activeId === item.id" size="small" @click="show = true"> @get-active-question="getActiveQuestion"
添加题目 ></Design>
</van-button>
</div>
</template>
</Design>
<!-- <van-button @click="show = true">添加题目</van-button>--> <!-- <van-button @click="show = true">添加题目</van-button>-->
<!-- 弹出的新增题目弹窗--> <!-- 弹出的新增题目弹窗-->
<van-popup <van-popup
@@ -80,9 +74,9 @@
<span>投放设置</span> <span>投放设置</span>
</div> </div>
<div class="survey-action_btn"> <div class="survey-action_btn">
<van-button size="small" @click="previewQuestion">预览</van-button> <van-button size="small">预览</van-button>
<van-button size="small" @click="saveAs">保存</van-button> <van-button size="small">保存</van-button>
<van-button size="small" @click="publishQuestion">投放</van-button> <van-button size="small" @click="$router.push({ name: 'publish' })">投放</van-button>
</div> </div>
</div> </div>
</div> </div>
@@ -102,7 +96,6 @@
size="0.5rem" size="0.5rem"
:active-value="1" :active-value="1"
:inactive-value="0" :inactive-value="0"
@change="saveIsOnePage"
></van-switch> ></van-switch>
</template> </template>
</van-cell> </van-cell>
@@ -288,7 +281,7 @@ import { ref, computed, onMounted, watch } from 'vue';
import * as Base64 from 'js-base64'; import * as Base64 from 'js-base64';
import { import {
getSetting, getSetting,
saveQuestions, questionDetails,
saveQuestion, saveQuestion,
snQuestions, snQuestions,
sync, sync,
@@ -309,9 +302,8 @@ import {
signQuestion, signQuestion,
nps nps
} from '@/utils/importJsons'; } from '@/utils/importJsons';
import { useRoute, useRouter } from 'vue-router'; import { useRoute } from 'vue-router';
import YLPicker from '@/components/YLPicker.vue'; import YLPicker from '@/components/YLPicker.vue';
import { getPages } from '@/utils/public';
// 获取 Store 实例 // 获取 Store 实例
const counterStore = useCounterStore(); const counterStore = useCounterStore();
@@ -322,7 +314,6 @@ const activeQuestionIndex = ref(-1);
const currentDate = ref(); const currentDate = ref();
const currentType = ref(); const currentType = ref();
const route = useRoute(); const route = useRoute();
const router = useRouter();
const surveyTitle = route.meta.title as string; const surveyTitle = route.meta.title as string;
const show = ref(false); const show = ref(false);
// const textModel = ref(false); // const textModel = ref(false);
@@ -353,7 +344,6 @@ const onConfirmDate = (e) => {
// 获取选中的题目 // 获取选中的题目
const getActiveQuestion = (activeQues) => { const getActiveQuestion = (activeQues) => {
chooseQuestionId.value = activeQues.id; chooseQuestionId.value = activeQues.id;
activeId.value = activeQues.id;
// 在questions 里 查找index 给 activeQuestionIndex // 在questions 里 查找index 给 activeQuestionIndex
questionInfo.value.questions.forEach((item, index) => { questionInfo.value.questions.forEach((item, index) => {
if (item.id === activeQues.id) { if (item.id === activeQues.id) {
@@ -363,7 +353,7 @@ const getActiveQuestion = (activeQues) => {
}; };
const saveTitle = () => { const saveTitle = () => {
saveQuestions({ questionDetails({
sn: route.query.sn, sn: route.query.sn,
title: questionInfo.value.survey.title, title: questionInfo.value.survey.title,
introduction: questionInfo.value.survey.introduction introduction: questionInfo.value.survey.introduction
@@ -492,10 +482,9 @@ const saveQuestionItem = (questionJson) => {
questions: [questionJson], questions: [questionJson],
survey: { survey: {
local_pages: [], local_pages: [],
pages: getPages( pages: questionInfo.value.questions.map((item) => {
questionInfo.value.questions, return [item.question_index];
questionInfo.value.survey.is_one_page_one_question }),
),
version: Base64.encode(`${new Date().getTime()}`) version: Base64.encode(`${new Date().getTime()}`)
} }
} }
@@ -531,13 +520,6 @@ const saveSetting = (parentKey, childKeys) => {
}); });
}; };
// 保存是否每页一题
const saveIsOnePage = () => {
saveQuestions({
sn: route.query.sn,
is_one_page_one_question: questionInfo.value.survey.is_one_page_one_question
});
};
const init = () => { const init = () => {
// event.detail 为当前输入的值 // event.detail 为当前输入的值
show.value = true; show.value = true;
@@ -583,20 +565,6 @@ watch(
}, },
{ deep: true } { deep: true }
); );
// 保存 目前没有任何逻辑可以执行所有保存
const saveAs = () => {
// 保存所有
};
// 投放
const publishQuestion = () => {
router.push({ name: 'publish', query: { ...route.query } });
};
// 预览
const previewQuestion = () => {
router.push({ name: 'preview', query: { ...route.query } });
};
onMounted(async() => { onMounted(async() => {
await getQuestionDetail(); // 等待接口返回数据 await getQuestionDetail(); // 等待接口返回数据
}); });
@@ -630,10 +598,8 @@ onMounted(async() => {
& > button { & > button {
margin: 20px; margin: 20px;
border-radius: 10px;
//border-radius: 10px; background-color: lightgreen;
background-color: #70b936;
color: #fff;
} }
} }
} }
@@ -658,21 +624,8 @@ onMounted(async() => {
font-size: 16px; font-size: 16px;
} }
& .design { & .desgin {
padding-bottom: 60px; padding-bottom: 50px;
& .design-button {
width: 100%;
text-align: center;
::v-deep .van-button {
background-color: #70b936;
//width: 140px;
color: #fff;
font-size: 12px;
}
}
} }
.ques_list { .ques_list {

View File

@@ -19,12 +19,11 @@
</div> </div>
<div>移动端仅做数据回收问卷数据分析请前往PC端浏览</div> <div>移动端仅做数据回收问卷数据分析请前往PC端浏览</div>
<div class="operation"> <div class="operation">
<span v-for="item in operateList" :key="item" @click="operateBtn(item)"> <span v-for="(item, index) in operateList" :key="index" @click="operateBtn(item)">
<img <img
width="30px" width="30px"
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/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
/> />
{{ item.title }} {{ item.title }}
</span> </span>
</div> </div>
@@ -42,22 +41,25 @@
height: 50px; height: 50px;
background-color: white; background-color: white;
" "
></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 } from 'vue'; import { onMounted, reactive, ref } from 'vue';
import appBridge from '@/assets/js/appBridge'; import appBridge from '@/assets/js/appBridge';
import { getQrcode } from '@/api/survey'; import { getQrcode } from '@/api/survey';
import { showFailToast, showSuccessToast } from 'vant';
const route = useRoute(); const route = useRoute();
const surveyTitle = route.meta.title as string; const surveyTitle = route.meta.title as string;
const operateList = [ const operateList = reactive([
{ {
title: '复制链接', title: '复制链接',
img: 'copyLink' type: 'copyLink',
img: ''
}, },
{ {
title: '转发到微信', title: '转发到微信',
@@ -69,32 +71,84 @@ const operateList = [
type: 'qrCode', type: 'qrCode',
img: '' img: ''
} }
]; ]);
onMounted(async() => {
const { data: linkData } = await getQrcode('Xxgdr5EN'); interface PublishInfo {
console.log('linkData', linkData); download_url: {
}); title: string;
// 分享链接
const shareLink = () => {
// const url = window.location.href;
const params = {
type: 'shareToWx',
title: '分享标题',
description: '分享副标题',
thumbImageUrl: 'https://logo.png',
webpageUrl: 'https://example.com',
scene: 0 // 朋友圈1 微信好友0
}; };
appBridge.shareToWeChat(params); desc?: string;
}; img_url: string;
const operateBtn = (item) => { url: string;
}
const publishInfo = ref<PublishInfo>({} as PublishInfo);
type OperateItem = typeof operateList[0];
onMounted(async() => {
getQrcode('Xxgdr5EN').then((res) => {
if (res.data) {
publishInfo.value = res.data.data || {};
console.log(res.data);
}
}).catch((error) => {
showFailToast(error.data?.message || error.message || '服务器错误');
});
});
const operateBtn = (item: OperateItem) => {
console.log(item); console.log(item);
switch (item.type) { switch (item.type) {
case 'shareLink': case 'shareLink':
shareLink(); shareLink();
break; break;
case 'copyLink':
copyLink();
break;
case 'qrCode':
downLoadImg();
break;
default:
break;
} }
}; };
// 复制链接
function copyLink() {
const input = document.createElement('input');
input.value = publishInfo.value.url;
document.body.appendChild(input);
input.select();
document.execCommand('Copy');
document.body.removeChild(input);
showSuccessToast('复制成功');
}
// 分享链接
function shareLink() {
const params = {
type: 'shareToWx',
title: publishInfo.value.download_url.title,
description: publishInfo.value.desc || '',
thumbImageUrl: publishInfo.value.img_url,
webpageUrl: publishInfo.value.url,
scene: 0 // 朋友圈1 微信好友0
};
appBridge.shareToWeChat(params, (result: any) => {
// console.log('分享结果:', result);
});
}
// 下载二维码
function downLoadImg() {
const { title, url } = publishInfo.value.download_url;
const link = document.createElement('a');
link.href = url;
link.download = title;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// const subdata = publishInfo.value.download_url
// store.dispatch('common/fileDown', subdata);
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">