Fix some issues with SurveyJS

This commit is contained in:
Ramon Wenger 2022-10-27 14:47:05 +02:00
parent 3f7898c451
commit 9c1d647e11
7 changed files with 110 additions and 104 deletions

131
client/package-lock.json generated
View File

@ -71,8 +71,7 @@
"sass-loader": "^12.6.0",
"semver": "^5.3.0",
"shelljs": "^0.8.5",
"survey-core": "1.9.41",
"survey-knockout-ui": "1.9.41",
"survey-knockout": "^1.9.41",
"ts-loader": "^8.3.0",
"typescript": "^4.5.4",
"uploadcare-widget": "^3.6.0",
@ -116,9 +115,9 @@
}
},
"node_modules/@apollo/client": {
"version": "3.7.0",
"resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.7.0.tgz",
"integrity": "sha512-hp4OvrH1ZIQACRYcIrh/C0WFnY7IM7G6nlTpC8DSTEWxfZQ2kvpvDY0I/hYmCs0oAVrg26g3ANEdOzGWTcYbPg==",
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.7.1.tgz",
"integrity": "sha512-xu5M/l7p9gT9Fx7nF3AQivp0XukjB7TM7tOd5wifIpI8RskYveL4I+rpTijzWrnqCPZabkbzJKH7WEAKdctt9w==",
"dependencies": {
"@graphql-typed-document-node/core": "^3.1.1",
"@wry/context": "^0.7.0",
@ -3958,9 +3957,9 @@
}
},
"node_modules/@sinclair/typebox": {
"version": "0.24.50",
"resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.50.tgz",
"integrity": "sha512-k8ETQOOQDg5FtK7y9KJWpsGLik+QlPmIi8zzl/dGUgshV2QitprkFlCR/AemjWOTyKn9UwSSGRTzLVotvgCjYQ=="
"version": "0.24.51",
"resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
"integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA=="
},
"node_modules/@sinonjs/commons": {
"version": "1.8.3",
@ -4317,9 +4316,9 @@
"integrity": "sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ=="
},
"node_modules/@types/node": {
"version": "18.11.5",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.5.tgz",
"integrity": "sha512-3JRwhbjI+cHLAkUorhf8RnqUbFXajvzX4q6fMn5JwkgtuwfYtRQYI3u4V92vI6NJuTsbBQWWh3RZjFsuevyMGQ=="
"version": "18.11.7",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.7.tgz",
"integrity": "sha512-LhFTglglr63mNXUSRYD8A+ZAIu5sFqNJ4Y2fPuY7UlrySJH87rRRlhtVmMHplmfk5WkoJGmDjE9oiTfyX94CpQ=="
},
"node_modules/@types/normalize-package-data": {
"version": "2.4.1",
@ -4352,9 +4351,9 @@
"integrity": "sha512-wWKOClTTiizcZhXnPY4wikVAwmdYHp8q6DmC+EJUzAMsycb7HB32Kh9RN4+0gExjmPmZSAQjgURXIGATPegAvA=="
},
"node_modules/@types/semver": {
"version": "7.3.12",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.3.12.tgz",
"integrity": "sha512-WwA1MW0++RfXmCr12xeYOOC5baSC9mSb0ZqCquFzKhcoF4TvHu5MKOuXsncgZcpVFhB1pXd5hZmM0ryAoCp12A=="
"version": "7.3.13",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.3.13.tgz",
"integrity": "sha512-21cFJr9z3g5dW8B0CVI9g2O9beqaThGQ6ZFBqHfwhzLDKUxaqTIy3vnfah/UPkfOiF2pLq+tGz+W8RyCskuslw=="
},
"node_modules/@types/serve-index": {
"version": "1.9.1",
@ -6187,9 +6186,9 @@
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001425",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001425.tgz",
"integrity": "sha512-/pzFv0OmNG6W0ym80P3NtapU0QEiDS3VuYAZMGoLLqiC7f6FJFe1MjpQDREGApeenD9wloeytmVDj+JLXPC6qw==",
"version": "1.0.30001426",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001426.tgz",
"integrity": "sha512-n7cosrHLl8AWt0wwZw/PJZgUg3lV0gk9LMI7ikGJwhyhgsd2Nb65vKvmSexCqq/J7rbH3mFG6yZZiPR5dLPW5A==",
"funding": [
{
"type": "opencollective",
@ -7235,9 +7234,9 @@
}
},
"node_modules/cypress": {
"version": "10.10.0",
"resolved": "https://registry.npmjs.org/cypress/-/cypress-10.10.0.tgz",
"integrity": "sha512-bU8r44x1NIYAUNNXt3CwJpLOVth7HUv2hUhYCxZmgZ1IugowDvuHNpevnoZRQx1KKOEisLvIJW+Xen5Pjn41pg==",
"version": "10.11.0",
"resolved": "https://registry.npmjs.org/cypress/-/cypress-10.11.0.tgz",
"integrity": "sha512-lsaE7dprw5DoXM00skni6W5ElVVLGAdRUUdZjX2dYsGjbY/QnpzWZ95Zom1mkGg0hAaO/QVTZoFVS7Jgr/GUPA==",
"hasInstallScript": true,
"dependencies": {
"@cypress/request": "^2.88.10",
@ -7291,9 +7290,9 @@
}
},
"node_modules/cypress/node_modules/@types/node": {
"version": "14.18.32",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.32.tgz",
"integrity": "sha512-Y6S38pFr04yb13qqHf8uk1nHE3lXgQ30WZbv1mLliV9pt0NjvqdWttLcrOYLnXbOafknVYRHZGoMSpR9UwfYow=="
"version": "14.18.33",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.33.tgz",
"integrity": "sha512-qelS/Ra6sacc4loe/3MSjXNL1dNQ/GjxNHVzuChwMfmk7HuycRLVQN2qNY3XahK+fZc5E2szqQSKUyAF0E+2bg=="
},
"node_modules/cypress/node_modules/ansi-styles": {
"version": "4.3.0",
@ -18428,18 +18427,12 @@
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/survey-core": {
"version": "1.9.41",
"resolved": "https://registry.npmjs.org/survey-core/-/survey-core-1.9.41.tgz",
"integrity": "sha512-JhJa27EPXqEPTZY1PR+4JwCKBgevGlHca2f6+R5QRCzeH5Xq7l+Fbg8HZCaPb967k1hSfCUUC8g07uUmO3oXLQ=="
},
"node_modules/survey-knockout-ui": {
"version": "1.9.41",
"resolved": "https://registry.npmjs.org/survey-knockout-ui/-/survey-knockout-ui-1.9.41.tgz",
"integrity": "sha512-Dj5Yk/2iNZ2YzGxzX7gNOsRAW8qEnce4xr6YyeXKBHwV1VGjFC6jdTFeuE4EBmuFhZnIskjS0jRPH1tlBOm13Q==",
"node_modules/survey-knockout": {
"version": "1.9.55",
"resolved": "https://registry.npmjs.org/survey-knockout/-/survey-knockout-1.9.55.tgz",
"integrity": "sha512-5r+PglnG5omD8WEo7F9/QWKcNEjdwukw6a4T/I+e/0o0A0WzUkpdZdxQVgttESLlgJcX+FeTk0eO8813/U/NVA==",
"dependencies": {
"knockout": "^3.5.0",
"survey-core": "*"
"knockout": "^3.5.1"
}
},
"node_modules/svgo": {
@ -19911,9 +19904,9 @@
}
},
"node_modules/webpack-bundle-analyzer": {
"version": "4.6.1",
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-4.6.1.tgz",
"integrity": "sha512-oKz9Oz9j3rUciLNfpGFjOb49/jEpXNmWdVH8Ls//zNcnLlQdTGXQQMsBbb/gR7Zl8WNLxVCq+0Hqbx3zv6twBw==",
"version": "4.7.0",
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-4.7.0.tgz",
"integrity": "sha512-j9b8ynpJS4K+zfO5GGwsAcQX4ZHpWV+yRiHDiL+bE0XHJ8NiPYLTNVQdlFYWxtpg9lfAQNlwJg16J9AJtFSXRg==",
"dependencies": {
"acorn": "^8.0.4",
"acorn-walk": "^8.0.0",
@ -20673,9 +20666,9 @@
}
},
"@apollo/client": {
"version": "3.7.0",
"resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.7.0.tgz",
"integrity": "sha512-hp4OvrH1ZIQACRYcIrh/C0WFnY7IM7G6nlTpC8DSTEWxfZQ2kvpvDY0I/hYmCs0oAVrg26g3ANEdOzGWTcYbPg==",
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.7.1.tgz",
"integrity": "sha512-xu5M/l7p9gT9Fx7nF3AQivp0XukjB7TM7tOd5wifIpI8RskYveL4I+rpTijzWrnqCPZabkbzJKH7WEAKdctt9w==",
"requires": {
"@graphql-typed-document-node/core": "^3.1.1",
"@wry/context": "^0.7.0",
@ -23488,9 +23481,9 @@
"integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw=="
},
"@sinclair/typebox": {
"version": "0.24.50",
"resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.50.tgz",
"integrity": "sha512-k8ETQOOQDg5FtK7y9KJWpsGLik+QlPmIi8zzl/dGUgshV2QitprkFlCR/AemjWOTyKn9UwSSGRTzLVotvgCjYQ=="
"version": "0.24.51",
"resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
"integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA=="
},
"@sinonjs/commons": {
"version": "1.8.3",
@ -23785,9 +23778,9 @@
"integrity": "sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ=="
},
"@types/node": {
"version": "18.11.5",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.5.tgz",
"integrity": "sha512-3JRwhbjI+cHLAkUorhf8RnqUbFXajvzX4q6fMn5JwkgtuwfYtRQYI3u4V92vI6NJuTsbBQWWh3RZjFsuevyMGQ=="
"version": "18.11.7",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.7.tgz",
"integrity": "sha512-LhFTglglr63mNXUSRYD8A+ZAIu5sFqNJ4Y2fPuY7UlrySJH87rRRlhtVmMHplmfk5WkoJGmDjE9oiTfyX94CpQ=="
},
"@types/normalize-package-data": {
"version": "2.4.1",
@ -23820,9 +23813,9 @@
"integrity": "sha512-wWKOClTTiizcZhXnPY4wikVAwmdYHp8q6DmC+EJUzAMsycb7HB32Kh9RN4+0gExjmPmZSAQjgURXIGATPegAvA=="
},
"@types/semver": {
"version": "7.3.12",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.3.12.tgz",
"integrity": "sha512-WwA1MW0++RfXmCr12xeYOOC5baSC9mSb0ZqCquFzKhcoF4TvHu5MKOuXsncgZcpVFhB1pXd5hZmM0ryAoCp12A=="
"version": "7.3.13",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.3.13.tgz",
"integrity": "sha512-21cFJr9z3g5dW8B0CVI9g2O9beqaThGQ6ZFBqHfwhzLDKUxaqTIy3vnfah/UPkfOiF2pLq+tGz+W8RyCskuslw=="
},
"@types/serve-index": {
"version": "1.9.1",
@ -25182,9 +25175,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30001425",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001425.tgz",
"integrity": "sha512-/pzFv0OmNG6W0ym80P3NtapU0QEiDS3VuYAZMGoLLqiC7f6FJFe1MjpQDREGApeenD9wloeytmVDj+JLXPC6qw=="
"version": "1.0.30001426",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001426.tgz",
"integrity": "sha512-n7cosrHLl8AWt0wwZw/PJZgUg3lV0gk9LMI7ikGJwhyhgsd2Nb65vKvmSexCqq/J7rbH3mFG6yZZiPR5dLPW5A=="
},
"caseless": {
"version": "0.12.0",
@ -25942,9 +25935,9 @@
}
},
"cypress": {
"version": "10.10.0",
"resolved": "https://registry.npmjs.org/cypress/-/cypress-10.10.0.tgz",
"integrity": "sha512-bU8r44x1NIYAUNNXt3CwJpLOVth7HUv2hUhYCxZmgZ1IugowDvuHNpevnoZRQx1KKOEisLvIJW+Xen5Pjn41pg==",
"version": "10.11.0",
"resolved": "https://registry.npmjs.org/cypress/-/cypress-10.11.0.tgz",
"integrity": "sha512-lsaE7dprw5DoXM00skni6W5ElVVLGAdRUUdZjX2dYsGjbY/QnpzWZ95Zom1mkGg0hAaO/QVTZoFVS7Jgr/GUPA==",
"requires": {
"@cypress/request": "^2.88.10",
"@cypress/xvfb": "^1.2.4",
@ -25991,9 +25984,9 @@
},
"dependencies": {
"@types/node": {
"version": "14.18.32",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.32.tgz",
"integrity": "sha512-Y6S38pFr04yb13qqHf8uk1nHE3lXgQ30WZbv1mLliV9pt0NjvqdWttLcrOYLnXbOafknVYRHZGoMSpR9UwfYow=="
"version": "14.18.33",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.33.tgz",
"integrity": "sha512-qelS/Ra6sacc4loe/3MSjXNL1dNQ/GjxNHVzuChwMfmk7HuycRLVQN2qNY3XahK+fZc5E2szqQSKUyAF0E+2bg=="
},
"ansi-styles": {
"version": "4.3.0",
@ -34204,18 +34197,12 @@
"resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
"integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w=="
},
"survey-core": {
"version": "1.9.41",
"resolved": "https://registry.npmjs.org/survey-core/-/survey-core-1.9.41.tgz",
"integrity": "sha512-JhJa27EPXqEPTZY1PR+4JwCKBgevGlHca2f6+R5QRCzeH5Xq7l+Fbg8HZCaPb967k1hSfCUUC8g07uUmO3oXLQ=="
},
"survey-knockout-ui": {
"version": "1.9.41",
"resolved": "https://registry.npmjs.org/survey-knockout-ui/-/survey-knockout-ui-1.9.41.tgz",
"integrity": "sha512-Dj5Yk/2iNZ2YzGxzX7gNOsRAW8qEnce4xr6YyeXKBHwV1VGjFC6jdTFeuE4EBmuFhZnIskjS0jRPH1tlBOm13Q==",
"survey-knockout": {
"version": "1.9.55",
"resolved": "https://registry.npmjs.org/survey-knockout/-/survey-knockout-1.9.55.tgz",
"integrity": "sha512-5r+PglnG5omD8WEo7F9/QWKcNEjdwukw6a4T/I+e/0o0A0WzUkpdZdxQVgttESLlgJcX+FeTk0eO8813/U/NVA==",
"requires": {
"knockout": "^3.5.0",
"survey-core": "*"
"knockout": "^3.5.1"
}
},
"svgo": {
@ -35332,9 +35319,9 @@
}
},
"webpack-bundle-analyzer": {
"version": "4.6.1",
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-4.6.1.tgz",
"integrity": "sha512-oKz9Oz9j3rUciLNfpGFjOb49/jEpXNmWdVH8Ls//zNcnLlQdTGXQQMsBbb/gR7Zl8WNLxVCq+0Hqbx3zv6twBw==",
"version": "4.7.0",
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-4.7.0.tgz",
"integrity": "sha512-j9b8ynpJS4K+zfO5GGwsAcQX4ZHpWV+yRiHDiL+bE0XHJ8NiPYLTNVQdlFYWxtpg9lfAQNlwJg16J9AJtFSXRg==",
"requires": {
"acorn": "^8.0.4",
"acorn-walk": "^8.0.0",

View File

@ -88,8 +88,7 @@
"sass-loader": "^12.6.0",
"semver": "^5.3.0",
"shelljs": "^0.8.5",
"survey-core": "1.9.41",
"survey-knockout-ui": "1.9.41",
"survey-knockout": "^1.9.41",
"ts-loader": "^8.3.0",
"typescript": "^4.5.4",
"uploadcare-widget": "^3.6.0",

View File

@ -19,11 +19,12 @@
</template>
<script>
import '@/styles/survey.modern.css';
import '@/styles/survey.reset.css';
import {css} from '@/survey.config';
import gql from 'graphql-tag';
import {Model} from 'survey-core';
import {Model, StylesManager} from 'survey-knockout';
// we are switching to the knockout version because the Vue version only works with Vue 2 (as of July 2022)
import 'survey-knockout-ui';
import SURVEY_QUERY from '@/graphql/gql/queries/surveyQuery.gql';
import UPDATE_ANSWER from '@/graphql/gql/mutations/updateAnswer.gql';
@ -34,6 +35,7 @@
import {meQuery} from '@/graphql/queries';
const Solution = () => import(/* webpackChunkName: "content-components" */'@/components/content-blocks/Solution');
StylesManager.applyTheme('modern');
const MODULE_QUERY = gql`
query ModuleSolutions($slug: String) {
@ -53,6 +55,7 @@
data() {
return {
survey: this.initSurvey(),
surveyData: null,
title: '',
module: {},
completed: false,
@ -105,6 +108,15 @@
},
},
mounted() {
if(this.surveyData) {
this.loadSurveyFromServer(this.surveyData);
}
},
destroyed() {
},
methods: {
initSurvey(data, answers) {
let survey = new Model(data);
@ -112,15 +124,12 @@
for (let k in answers) {
flatAnswers[k] = answers[k].answer;
}
this.$log.debug('flatAnswers', flatAnswers);
this.$log.debug('data', survey.data);
if (Object.keys(flatAnswers).length > 0) {
// answers are not empty
survey.data = flatAnswers;
}
const saveSurvey = (sender, {exit}) => {
this.$log.debug('saving survey', sender);
if (this.saveDisabled) {
return;
}
@ -188,7 +197,6 @@
survey.locale = 'de';
survey.showProgressBar = 'bottom';
survey.pageNextText = 'Speichern & Weiter';
this.$log.debug(survey.data);
survey.render('survey');
return survey;
},
@ -200,6 +208,20 @@
this.survey.data = data; // reapply it
this.saveDisabled = false;
},
loadSurveyFromServer(survey) {
let json = JSON.parse(survey.data);
json.showTitle = false;
json.showProgressBar = 'bottom';
let answer = {};
if (survey.answer && survey.answer.data) {
answer = JSON.parse(survey.answer.data);
}
if (!this.completed) {
this.survey = this.initSurvey(json, answer);
}
this.title = json.title;
}
},
apollo: {
@ -213,17 +235,8 @@
manual: true,
result({data, loading }) {
if (!loading) {
let json = JSON.parse(data.survey.data);
json.showTitle = false;
let answer = {};
if (data.survey.answer && data.survey.answer.data) {
answer = JSON.parse(data.survey.answer.data);
}
if (!this.completed) {
this.survey = this.initSurvey(json, answer);
}
this.title = json.title;
this.surveyData = data.survey;
this.loadSurveyFromServer(data.survey);
const module = data.survey.module;
this.$apollo.addSmartQuery('module', {

View File

@ -71,7 +71,12 @@
margin-left: auto;
> span {
display: none;
position: absolute;
width: 100%;
text-align: right;
bottom: -2em;
@include regular-text;
}
}
@ -86,11 +91,6 @@
height: 100%;
> span {
position: absolute;
width: 100%;
text-align: right;
bottom: -2em;
@include regular-text;
}
}

View File

@ -1,10 +1,11 @@
from wagtail.contrib.modeladmin.options import ModelAdmin, modeladmin_register
from .models import Assignment
class AssignmentAdmin(ModelAdmin):
model = Assignment
list_display = ('title', 'module', 'assignment')
list_display = ('title', 'module', 'assignment',)
search_fields = ('title', 'assignment')
menu_icon = 'form'

View File

@ -35,15 +35,20 @@ class JSONAdmin(admin.ModelAdmin):
JSONField: {'widget': PrettyJSONWidget}
}
class SurveyAdminLinkMixin:
def link(self, obj):
return format_html('<a href="/survey/{id}" target="_blank">Link</a>', id=to_global_id('SurveyNode', obj.pk))
link.short_description = 'Link'
@admin.register(Survey)
class SurveyAdmin(JSONAdmin):
class SurveyAdmin(JSONAdmin, SurveyAdminLinkMixin):
list_display = ('title', 'link',)
list_filter = ('module',)
search_fields = ('title', 'data')
def link(self, obj):
return format_html('<a href="/survey/{id}" target="_blank">Link</a>', id=to_global_id('SurveyNode', obj.pk))
link.short_description = 'Link'
@admin.register(Answer)
class AnswerAdmin(JSONAdmin):

View File

@ -1,11 +1,12 @@
from wagtail.contrib.modeladmin.options import ModelAdmin, modeladmin_register
from .models import Survey
from surveys.admin import SurveyAdminLinkMixin
class SurveyAdmin(ModelAdmin):
class SurveyAdmin(ModelAdmin, SurveyAdminLinkMixin):
model = Survey
menu_label = 'Surveys'
list_display = ('title', 'module')
list_display = ('title', 'module', 'link')
search_fields = ('title', 'module__meta_title')
menu_icon = 'help'