feat: survey vuex to pinia

web/src/render/pages/IndexPage.vue

@@ -8,11 +8,13 @@ import { useRoute } from 'vue-router'
 
 import { getPublishedSurveyInfo, getPreviewSchema } from '../api/survey'
 import useCommandComponent from '../hooks/useCommandComponent'
+import { useSurveyStore } from '../stores/survey'
 
 import AlertDialog from '../components/AlertDialog.vue'
 import { initRuleEngine } from '@/render/hooks/useRuleEngine.js'
 const store = useStore()
 const route = useRoute()
+const surveyStore = useSurveyStore()
 const loadData = (res: any, surveyPath: string) => {
  if (res.code === 200) {
  const data = res.data
@@ -36,7 +38,7 @@ const loadData = (res: any, surveyPath: string) => {
 
  document.title = data.title
 
- store.commit('setSurveyPath', surveyPath)
+ surveyStore.setSurveyPath(surveyPath)
  store.dispatch('init', questionData)
  initRuleEngine(logicConf?.showLogicConf)
  } else {
@@ -46,7 +48,7 @@ const loadData = (res: any, surveyPath: string) => {
 onMounted(() => {
  const surveyId = route.params.surveyId
  console.log({ surveyId })
- store.commit('setSurveyPath', surveyId)
+ surveyStore.setSurveyPath(surveyId)
  getDetail(surveyId as string)
 })
 
@@ -60,7 +62,7 @@ const getDetail = async (surveyPath: string) => {
  } else {
  const res: any = await getPublishedSurveyInfo({ surveyPath })
  loadData(res, surveyPath)
- store.dispatch('getEncryptInfo')
+ surveyStore.getEncryptInfo();
  }
  } catch (error: any) {
  console.log(error)

web/src/render/pages/RenderPage.vue

@@ -29,6 +29,7 @@ import AlertDialog from '../components/AlertDialog.vue'
 import ConfirmDialog from '../components/ConfirmDialog.vue'
 import ProgressBar from '../components/ProgressBar.vue'
 
+import { useSurveyStore } from '../stores/survey'
 import { submitForm } from '../api/survey'
 import encrypt from '../utils/encrypt'
 
@@ -57,21 +58,22 @@ const confirm = useCommandComponent(ConfirmDialog)
 
 const store = useStore()
 const router = useRouter()
+const surveyStore = useSurveyStore()
 
 const bannerConf = computed(() => store.state?.bannerConf || {})
 const renderData = computed(() => store.getters.renderData)
 const submitConf = computed(() => store.state?.submitConf || {})
 const logoConf = computed(() => store.state?.bottomConf || {})
-const surveyPath = computed(() => store.state?.surveyPath || '')
+const surveyPath = computed(() => surveyStore.surveyPath || '')
 
 const validate = (cbk: (v: boolean) => void) => {
  const index = 0
  mainRef.value.$refs.formGroup[index].validate(cbk)
 }
 
 const normalizationRequestBody = () => {
- const enterTime = store.state.enterTime
- const encryptInfo = store.state.encryptInfo
+ const enterTime = surveyStore.enterTime
+ const encryptInfo = surveyStore.encryptInfo as any;
  const formValues = store.state.formValues
 
  const result: any = {
@@ -82,7 +84,7 @@ const normalizationRequestBody = () => {
  }
 
  if (encryptInfo?.encryptType) {
- result.encryptType = encryptInfo?.encryptType
+ result.encryptType = encryptInfo.encryptType
  result.data = encrypt[result.encryptType as 'rsa']({
  data: result.data,
  secretKey: encryptInfo?.data?.secretKey

web/src/render/store/actions.js

@@ -4,16 +4,17 @@ import 'moment/locale/zh-cn'
 // 设置中文
 moment.locale('zh-cn')
 import adapter from '../adapter'
-import { queryVote, getEncryptInfo } from '@/render/api/survey'
+import { queryVote } from '@/render/api/survey'
 import { RuleMatch } from '@/common/logicEngine/RulesMatch'
+import { useSurveyStore } from '@/render/stores/survey'
 /**
  * CODE_MAP不从management引入，在dev阶段，会导致B端 router被加载，进而导致C端路由被添加 baseUrl: /management
  */
-const CODE_MAP = {
- SUCCESS: 200,
- ERROR: 500,
- NO_AUTH: 403
-}
+// const CODE_MAP = {
+//  SUCCESS: 200,
+//  ERROR: 500,
+//  NO_AUTH: 403
+// }
 const VOTE_INFO_KEY = 'voteinfo'
 import router from '../router'
 export default {
@@ -22,7 +23,8 @@ export default {
  { commit, dispatch },
  { bannerConf, baseConf, bottomConf, dataConf, skinConf, submitConf }
  ) {
- commit('setEnterTime')
+ const surveyStore = useSurveyStore()
+ surveyStore.setEnterTime();
  const { begTime, endTime, answerBegTime, answerEndTime } = baseConf
  const { msgContent } = submitConf
  const now = Date.now()
@@ -90,8 +92,9 @@ export default {
  },
  // 初始化投票题的数据
  async initVoteData({ state, commit }) {
+ const surveyStore = useSurveyStore()
  const questionData = state.questionData
- const surveyPath = state.surveyPath
+ const surveyPath = surveyStore.surveyPath
 
  const fieldList = []
 
@@ -163,16 +166,16 @@ export default {
  commit('updateVoteMapByKey', totalPayload)
  })
  },
- async getEncryptInfo({ commit }) {
- try {
- const res = await getEncryptInfo()
- if (res.code === CODE_MAP.SUCCESS) {
- commit('setEncryptInfo', res.data)
- }
- } catch (error) {
- console.log(error)
- }
- },
+ // async getEncryptInfo({ commit }) {
+ //  try {
+ //  const res = await getEncryptInfo()
+ //  if (res.code === CODE_MAP.SUCCESS) {
+ //  commit('setEncryptInfo', res.data)
+ //  }
+ //  } catch (error) {
+ //  console.log(error)
+ //  }
+ // },
  async initRuleEngine({ commit }, ruleConf) {
  const ruleEngine = new RuleMatch(ruleConf)
  commit('setRuleEgine', ruleEngine)

web/src/render/store/mutations.js

@@ -24,12 +24,12 @@ export default {
  const { key, value, field } = data
  set(state, `questionData.${field}.othersValue.${key}`, value)
  },
- setEnterTime(state) {
- state.enterTime = Date.now()
- },
- setSurveyPath(state, data) {
- state.surveyPath = data
- },
+ // setEnterTime(state) {
+ //  state.enterTime = Date.now()
+ // },
+ // setSurveyPath(state, data) {
+ //  state.surveyPath = data
+ // },
  setVoteMap(state, data) {
  state.voteMap = data
  },
@@ -44,9 +44,9 @@ export default {
  setQuestionSeq(state, data) {
  state.questionSeq = data
  },
- setEncryptInfo(state, data) {
- state.encryptInfo = data
- },
+ // setEncryptInfo(state, data) {
+ //  state.encryptInfo = data
+ // },
  setRuleEgine(state, ruleEngine) {
  state.ruleEngine = ruleEngine
  }

web/src/render/store/state.js

@@ -1,16 +1,16 @@
-import { isMobile } from '../utils/index'
+// import { isMobile } from '../utils/index'
 
 export default {
- surveyPath: '',
+ // surveyPath: '',
  questionData: null,
- isMobile: isMobile(),
+ // isMobile: isMobile(),
  errorInfo: {
  errorType: '',
  errorMsg: ''
  },
- enterTime: null,
+ // enterTime: null,
  questionSeq: [], // 题目的顺序，因为可能会有分页的情况，所以是一个二维数组[[qid1, qid2], [qid3,qid4]]
  voteMap: {},
- encryptInfo: null,
+ // encryptInfo: null,
  ruleEngine: null
 }

web/src/render/stores/survey.js

@@ -1 +1,50 @@
-// 问卷相关的Pinia Store
+// 问卷相关的Pinia Store
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import { isMobile as isInMobile } from '@/render/utils/index'
+import { getEncryptInfo as getEncryptInfoApi } from '@/render/api/survey'
+
+/**
+ * CODE_MAP不从management引入，在dev阶段，会导致B端 router被加载，进而导致C端路由被添加 baseUrl: /management
+ */
+const CODE_MAP = {
+ SUCCESS: 200,
+ ERROR: 500,
+ NO_AUTH: 403
+}
+export const useSurveyStore = defineStore('survey', () => {
+ const surveyPath = ref('');
+ const isMobile = ref(isInMobile())
+ const enterTime = ref(0)
+ const encryptInfo = ref(null)
+
+ const setSurveyPath = ( data) => {
+ surveyPath.value = data
+ }
+
+ const setEnterTime = () => {
+ enterTime.value = Date.now()
+ }
+
+ const getEncryptInfo = async() => {
+ try {
+ const res = await getEncryptInfoApi()
+ if (res.code === CODE_MAP.SUCCESS) {
+ encryptInfo.value = res.data
+ }
+ } catch (error) {
+ console.log(error)
+ }
+ }
+
+ return {
+ surveyPath,
+ isMobile,
+ enterTime,
+ encryptInfo,
+
+ setSurveyPath,
+ setEnterTime,
+ getEncryptInfo
+ }
+})