|
|
@@ -1,4 +1,11 @@
|
|
|
-import { defineComponent, onMounted, onUnmounted, reactive, ref, nextTick } from 'vue';
|
|
|
+import {
|
|
|
+ defineComponent,
|
|
|
+ onMounted,
|
|
|
+ onUnmounted,
|
|
|
+ reactive,
|
|
|
+ ref,
|
|
|
+ nextTick
|
|
|
+} from 'vue';
|
|
|
import styles from './index.module.less';
|
|
|
// import signinTips from './images/signin-tips.png';
|
|
|
import {
|
|
|
@@ -12,7 +19,7 @@ import {
|
|
|
Loading
|
|
|
} from 'vant';
|
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
-import threeMan from './images/update/three-man.png'
|
|
|
+import threeMan from './images/update/three-man.png';
|
|
|
import OWxTip from '@/components/m-wx-tip';
|
|
|
import { browser, getHttpOrigin, getUrlCode } from '@/helpers/utils';
|
|
|
import qs from 'query-string';
|
|
|
@@ -22,12 +29,19 @@ import { useInterval, useIntervalFn } from '@vueuse/core';
|
|
|
import MMessageTip from '@/components/m-message-tip';
|
|
|
import TCPlayer from 'tcplayer.js';
|
|
|
import 'tcplayer.js/dist/tcplayer.css';
|
|
|
-import { _initVideo } from './initVideo'
|
|
|
-import nextBtn from './images/next_btn.png'
|
|
|
+import { _initVideo } from './initVideo';
|
|
|
+import nextBtn from './images/next_btn.png';
|
|
|
+import useWeChatShare from '@/hooks/useWeChatShare';
|
|
|
|
|
|
export default defineComponent({
|
|
|
name: 'intention-questionnaire',
|
|
|
setup() {
|
|
|
+ const weChatShare = useWeChatShare(
|
|
|
+ '关于开展音乐（器乐）课堂数字化转型的调查问卷',
|
|
|
+ '科学的教育与关爱，足以改变世界，通过科技的力量让音乐传播得更远，让每一名孩子奏响心中的乐章',
|
|
|
+ window.location.origin + '/classroom-app/shareImg/instrument-share.png'
|
|
|
+ );
|
|
|
+
|
|
|
// 页面定时
|
|
|
const pageTimer = useInterval(1000, { controls: true });
|
|
|
pageTimer.pause();
|
|
|
@@ -38,25 +52,34 @@ export default defineComponent({
|
|
|
code: null as any,
|
|
|
openId: '' as any,
|
|
|
isPageHide: false,
|
|
|
- contentA: '<p style="text-align: left; font-size:13px;"><strong style="font-size:15px;">尊敬的家长： 您好！</strong></p><p style="text-align: left;">非常感谢您一直以来对学校工作给予的大力支持与密切关注。为深入贯彻教育部《关于全面实施学校美育浸润行动的通知》（教体艺〔2023〕5 号）文件精神，积极顺应艺术素质测评结果纳入中考的教育改革趋势，致力于让学生在在校期间熟练掌握 1 - 2 项艺术专长，全面提升学生的艺术素养。</p><p style="text-align: left;">我校计划在北京知勉公益基金会的支持下，启动音乐（器乐）课堂数字化转型工作。为了确保此项工作顺利开展，现向您详细介绍相关情况，并诚恳征询您的宝贵意见，学校将根据您的意见反馈决定开展与否。</p>', // 第一段
|
|
|
- contentB: '<p style="text-align: left;"><strong style="font-size:15px; color: #0B8BFE;">二、为什么要开展数字化转型</strong></p><p style="text-align: left;">1.解决学习难题：数字化转型将为乐器学习和练习制定明确标准，学生能实时知晓练习的对错，练习结果也可量化呈现，有效解决学生不会练、家长无法辅导的困扰。</p><p style="text-align: left;">2.适应教改趋势：随着教育改革的推进，艺术素质测评结果已逐步纳入中考，数字化转型将助力学生更好地适应这一变化，提升综合素养。</p><p style="text-align: left;">3.关注身心健康：乐器学习能成为学生缓解学习压力的有效途径，有助于学生保持身心健康，实现全面发展。</p><p style="text-align: left;"><br></p>', // 第二段
|
|
|
- contentC: '<p style="text-align: left;"><strong style="font-size:15px; color: #0B8BFE;">三、开展原则</strong></p><p style="text-align: left;">本次活动面向全体学生，完全遵循学生自愿参加的原则。</p><p style="text-align: left;">1.若学生选择参加转型，家长需自行为学生准备好自用的乐器（硬件）和“器乐数字 Ai”应用（软件，用于联通学校音乐课堂）两项学习工具。</p><p style="text-align: left;">2.若学生不参加转型，可继续按原有方式进行音乐课学习。</p>',
|
|
|
- contentD: '<p style="text-align: left;"><strong style="font-size:15px; color: #0B8BFE;">五、事项说明</strong></p><p style="text-align: left;">1.学校不涉及任何费用收取。学生所需的自用工具在市面上均可购买到，家长可自行根据实际情况为学生准备。</p><p style="text-align: left;">2.如学生有参加数字化转型的意愿，但存在特殊或特困情况，可先向学校进行登记，学校将尽力寻求资源协助家长解决。</p><p style="text-align: left;">在您了解上述内容后，请点击下一步进行意见填写：</p>',
|
|
|
- introductionVideo: "https://oss.dayaedu.com/ktyq/02/1739345029052.mp4",
|
|
|
+ contentA:
|
|
|
+ '<p style="text-align: left; font-size:13px;"><strong style="font-size:15px;">尊敬的家长： 您好！</strong></p><p style="text-align: left;">非常感谢您一直以来对学校工作给予的大力支持与密切关注。为深入贯彻教育部《关于全面实施学校美育浸润行动的通知》（教体艺〔2023〕5 号）文件精神，积极顺应艺术素质测评结果纳入中考的教育改革趋势，致力于让学生在在校期间熟练掌握 1 - 2 项艺术专长，全面提升学生的艺术素养。</p><p style="text-align: left;">我校计划在北京知勉公益基金会的支持下，启动音乐（器乐）课堂数字化转型工作。为了确保此项工作顺利开展，现向您详细介绍相关情况，并诚恳征询您的宝贵意见，学校将根据您的意见反馈决定开展与否。</p>', // 第一段
|
|
|
+ contentB:
|
|
|
+ '<p style="text-align: left;"><strong style="font-size:15px; color: #0B8BFE;">二、为什么要开展数字化转型</strong></p><p style="text-align: left;">1.解决学习难题：数字化转型将为乐器学习和练习制定明确标准，学生能实时知晓练习的对错，练习结果也可量化呈现，有效解决学生不会练、家长无法辅导的困扰。</p><p style="text-align: left;">2.适应教改趋势：随着教育改革的推进，艺术素质测评结果已逐步纳入中考，数字化转型将助力学生更好地适应这一变化，提升综合素养。</p><p style="text-align: left;">3.关注身心健康：乐器学习能成为学生缓解学习压力的有效途径，有助于学生保持身心健康，实现全面发展。</p><p style="text-align: left;"><br></p>', // 第二段
|
|
|
+ contentC:
|
|
|
+ '<p style="text-align: left;"><strong style="font-size:15px; color: #0B8BFE;">三、开展原则</strong></p><p style="text-align: left;">本次活动面向全体学生，完全遵循学生自愿参加的原则。</p><p style="text-align: left;">1.若学生选择参加转型，家长需自行为学生准备好自用的乐器（硬件）和“器乐数字 Ai”应用（软件，用于联通学校音乐课堂）两项学习工具。</p><p style="text-align: left;">2.若学生不参加转型，可继续按原有方式进行音乐课学习。</p>',
|
|
|
+ contentD:
|
|
|
+ '<p style="text-align: left;"><strong style="font-size:15px; color: #0B8BFE;">五、事项说明</strong></p><p style="text-align: left;">1.学校不涉及任何费用收取。学生所需的自用工具在市面上均可购买到，家长可自行根据实际情况为学生准备。</p><p style="text-align: left;">2.如学生有参加数字化转型的意愿，但存在特殊或特困情况，可先向学校进行登记，学校将尽力寻求资源协助家长解决。</p><p style="text-align: left;">在您了解上述内容后，请点击下一步进行意见填写：</p>',
|
|
|
+ introductionVideo: 'https://oss.dayaedu.com/ktyq/02/1739345029052.mp4',
|
|
|
introductionVideoTime: 117,
|
|
|
- coverImg: "https://oss.dayaedu.com/ktyq/02/1739362815061.png",
|
|
|
- introductionVideo2: "https://oss.dayaedu.com/ktyq/02/1739345326291.mp4",
|
|
|
+ coverImg: 'https://oss.dayaedu.com/ktyq/02/1739362815061.png',
|
|
|
+ introductionVideo2: 'https://oss.dayaedu.com/ktyq/02/1739345326291.mp4',
|
|
|
introductionVideoTime2: 111,
|
|
|
- coverImg2: "https://oss.dayaedu.com/ktyq/02/1739324215341.png",
|
|
|
+ coverImg2: 'https://oss.dayaedu.com/ktyq/02/1739324215341.png',
|
|
|
player1: null as any,
|
|
|
player2: null as any,
|
|
|
player1Speed: 1,
|
|
|
player2Speed: 1,
|
|
|
videoLoading1: true,
|
|
|
videoLoading2: true,
|
|
|
- meetingType: 'primarySchoolNo' as 'primarySchoolNo' | 'primarySchoolYes' | 'juniorSchoolNo' | 'juniorSchool' | any,
|
|
|
+ meetingType: 'primarySchoolNo' as
|
|
|
+ | 'primarySchoolNo'
|
|
|
+ | 'primarySchoolYes'
|
|
|
+ | 'juniorSchoolNo'
|
|
|
+ | 'juniorSchool'
|
|
|
+ | any,
|
|
|
intentionInfo: null as any,
|
|
|
- contentShow: false,
|
|
|
+ contentShow: false
|
|
|
});
|
|
|
|
|
|
const showPopup = ref(false);
|
|
|
@@ -69,6 +92,7 @@ export default defineComponent({
|
|
|
const videoIntervalRef2 = useInterval(1000, { controls: true });
|
|
|
videoIntervalRef2.pause();
|
|
|
|
|
|
+ weChatShare.getAppSignature()
|
|
|
onMounted(async () => {
|
|
|
forms.meetingType = route.query.type || forms.meetingType;
|
|
|
forms.code = route.query.code || forms.code;
|
|
|
@@ -90,23 +114,26 @@ export default defineComponent({
|
|
|
// 判断是否获取微信code码
|
|
|
if (!forms.code && browser().weixin) return;
|
|
|
const { data } = await request.get(
|
|
|
- '/edu-app/open/meetingQuestionSetting/detail?type=' + forms.meetingType + '&weChatCode=' + forms.code
|
|
|
+ '/edu-app/open/meetingQuestionSetting/detail?type=' +
|
|
|
+ forms.meetingType +
|
|
|
+ '&weChatCode=' +
|
|
|
+ forms.code
|
|
|
);
|
|
|
if (data) {
|
|
|
- forms.contentA = data.contentA || forms.contentA
|
|
|
- forms.contentB = data.contentB || forms.contentB
|
|
|
- forms.contentC = data.contentC || forms.contentC
|
|
|
- forms.contentD = data.contentD || forms.contentD
|
|
|
- forms.openId = data.openId || forms.openId
|
|
|
+ forms.contentA = data.contentA || forms.contentA;
|
|
|
+ forms.contentB = data.contentB || forms.contentB;
|
|
|
+ forms.contentC = data.contentC || forms.contentC;
|
|
|
+ forms.contentD = data.contentD || forms.contentD;
|
|
|
+ forms.openId = data.openId || forms.openId;
|
|
|
sessionStorage.setItem('active-open-id', forms.openId);
|
|
|
}
|
|
|
- forms.contentShow = true
|
|
|
+ forms.contentShow = true;
|
|
|
} catch {
|
|
|
- forms.contentShow = true
|
|
|
+ forms.contentShow = true;
|
|
|
}
|
|
|
- console.log('初始化视频',111)
|
|
|
- forms.player1 = _initVideo('one', forms, videoIntervalRef)
|
|
|
- forms.player2 = _initVideo('two', forms, videoIntervalRef2)
|
|
|
+ console.log('初始化视频', 111);
|
|
|
+ forms.player1 = _initVideo('one', forms, videoIntervalRef);
|
|
|
+ forms.player2 = _initVideo('two', forms, videoIntervalRef2);
|
|
|
});
|
|
|
|
|
|
const getAppIdAndCode = async (url?: string) => {
|
|
|
@@ -120,9 +147,9 @@ export default defineComponent({
|
|
|
closeToast();
|
|
|
goWechatAuth(data, url);
|
|
|
}
|
|
|
- } catch(e) {
|
|
|
+ } catch (e) {
|
|
|
//
|
|
|
- console.log(e)
|
|
|
+ console.log(e);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
@@ -132,7 +159,7 @@ export default defineComponent({
|
|
|
forms.openId = openId;
|
|
|
const code = getUrlCode();
|
|
|
const isWxcode = sessionStorage.getItem('isWxcode');
|
|
|
- console.log(code, 'code', isWxcode)
|
|
|
+ console.log(code, 'code', isWxcode);
|
|
|
if (!code || isWxcode !== '1') {
|
|
|
const newUrl =
|
|
|
getHttpOrigin() +
|
|
|
@@ -185,10 +212,16 @@ export default defineComponent({
|
|
|
});
|
|
|
return () => (
|
|
|
<div class={styles['intention-page']}>
|
|
|
- <div class={[styles['content-box'], !forms.contentShow && styles.hideContent]}>
|
|
|
+ <div
|
|
|
+ class={[
|
|
|
+ styles['content-box'],
|
|
|
+ !forms.contentShow && styles.hideContent
|
|
|
+ ]}>
|
|
|
<div class={styles.contentBody} v-html={forms.contentA}></div>
|
|
|
<div class={styles.contentBody}>
|
|
|
- <div class={styles.cbTitle}>一、什么是音乐（器乐）课堂数字化转型<span>（详见视频介绍）</span></div>
|
|
|
+ <div class={styles.cbTitle}>
|
|
|
+ 一、什么是音乐（器乐）课堂数字化转型<span>（详见视频介绍）</span>
|
|
|
+ </div>
|
|
|
<div class={styles.videoBoxCon}>
|
|
|
<div class={styles.videoBox}>
|
|
|
<div class={[styles['video-content']]}>
|
|
|
@@ -206,7 +239,9 @@ export default defineComponent({
|
|
|
<div class={styles.contentBody} v-html={forms.contentB}></div>
|
|
|
<div class={styles.contentBody} v-html={forms.contentC}></div>
|
|
|
<div class={styles.contentBody}>
|
|
|
- <div class={styles.cbTitle}>四、什么是器乐数字 Ai<span>（详见视频介绍）</span></div>
|
|
|
+ <div class={styles.cbTitle}>
|
|
|
+ 四、什么是器乐数字 Ai<span>（详见视频介绍）</span>
|
|
|
+ </div>
|
|
|
<div class={styles.videoBoxCon}>
|
|
|
<div class={styles.videoBox}>
|
|
|
<div class={[styles['video-content']]}>
|
|
|
@@ -227,14 +262,14 @@ export default defineComponent({
|
|
|
{/* 是否在微信中打开 */}
|
|
|
<OWxTip />
|
|
|
|
|
|
- {
|
|
|
- forms.openId &&
|
|
|
+ {forms.openId && (
|
|
|
<div class={styles.bottomBtn}>
|
|
|
- <p>在您了解上述内容后，<i>请点击下一步进行意见填写</i></p>
|
|
|
+ <p>
|
|
|
+ 在您了解上述内容后，<i>请点击下一步进行意见填写</i>
|
|
|
+ </p>
|
|
|
<img class={styles.nextBtn} src={nextBtn} onClick={nextSkip} />
|
|
|
- </div>
|
|
|
- }
|
|
|
-
|
|
|
+ </div>
|
|
|
+ )}
|
|
|
</div>
|
|
|
);
|
|
|
}
|
