提交问卷时又白名单新增verifyId参数 (#316)

* --story=1059873 --user=T8罗佳明 【ALL】2024年06月日常优化 https://www.tapd.cn/23402991/s/2202857

* feat:答卷白名单功能

* fix:修复lint问题

* fix:提交问卷时添加verifyId参数

web/src/management/pages/edit/modules/settingModule/config/baseFormConfig.js

@@ -26,7 +26,8 @@ export default {
     keys: ['baseConf.passwordSwitch', 'baseConf.password'],
     label: '访问密码',
     type: 'SwitchInput',
-    placeholder: '请输入访问密码'
+    placeholder: '请输入6位字符串类型访问密码 ',
+    maxLength: 6,
   },
   answer_type: {
     key: 'baseConf.whitelistType',
@@ -38,7 +39,7 @@ export default {
     label: '名单登录提示语',
     placeholder:'请输入名单提示语',
     type: 'InputWordLimit',
-    maxlength: 40,
+    maxLength: 40,
     relyFunc: (data) => {
       return  ['CUSTOM','MEMBER'].includes(data.whitelistType)
     }

web/src/materials/setters/widgets/InputWordLimit.vue

@@ -1,6 +1,6 @@
 <template>
   <el-input
-      :maxlength="maxlength"
+      :maxlength="maxLength"
       v-model="modelValue"
       :placeholder="placeholder"
       show-word-limit
@@ -19,7 +19,7 @@ const emit = defineEmits([FORM_CHANGE_EVENT_KEY])
 
 const modelValue = ref(props.formConfig.value || '')
 
-const maxlength = computed(() => props.formConfig.maxlength || 10)
+const maxLength = computed(() => props.formConfig.maxLength || 10)
 
 const placeholder = computed(() => props.formConfig.placeholder || '')
 
@@ -27,7 +27,6 @@ const handleInputChange = (value) => {
   const key = props.formConfig.key
 
   modelValue.value = value
-
   emit(FORM_CHANGE_EVENT_KEY, { key, value })
 }
 

web/src/materials/setters/widgets/SwitchInput.vue

@@ -1,37 +1,45 @@
 <template>
   <div class="switch-input-wrap">
     <el-switch v-model="passwordSwitch" @change="changeData(props.formConfig.keys[0],passwordSwitch)"  />
-    <el-input
+    <InputWordLimit
       v-if="passwordSwitch"
       class="mt16"
-      maxlength="6"
-      placeholder="请输入6位字符串类型访问密码"
-      show-word-limit
-      v-model="password"
-      type="text"
-      @blur="changeData(props.formConfig.keys[1],password)"
+      @form-change="handleFormChange"
+      :formConfig="{
+        ...props.formConfig,
+        key: props.formConfig.keys[1],
+        value:props.formConfig?.value[1]
+      }"
     />
   </div>
 </template>
 <script setup>
 import { ref } from 'vue'
+import { useStore } from 'vuex'
 import { FORM_CHANGE_EVENT_KEY } from '@/materials/setters/constant'
+import InputWordLimit from './InputWordLimit.vue'
 
+const store = useStore();
 const props = defineProps({
   formConfig: Object,
 })
 const emit = defineEmits([FORM_CHANGE_EVENT_KEY])
 const passwordSwitch = ref(props.formConfig?.value[0] || false);
-const password = ref(props.formConfig?.value[1] || '');
 
-const changeData = (key,value) => {
+
+const changeData = (key, value) => {
   emit(FORM_CHANGE_EVENT_KEY, {
     key,
     value
   })
 
 }
-
+const handleFormChange = (data) => {
+  store.dispatch('edit/changeSchema', {
+    key: data.key,
+    value: data.value
+  })
+}
 
 </script>
 <style lang="scss" scoped>

web/src/render/components/VerifyWhiteDialog.vue

@@ -17,14 +17,14 @@
       </div>
     </template>
     <div class="verify-white-body">
-      <el-input v-if="isPwd" v-model="state.password" class="wd255"  placeholder="请输入6位字符串类型访问密码"  />
-      <el-input v-if="isValue" v-model="state.value" class="wd255 mt16"  :placeholder="placeholder"  />
+      <el-input v-if="isPwd" v-model="state.password" class="wd255 mb16"  placeholder="请输入6位字符串类型访问密码"  />
+      <el-input v-if="isValue" v-model="state.value" class="wd255 mb16"  :placeholder="placeholder"  />
       <div class="submit-btn" @click="handleSubmit">验证并开始答题</div>
     </div>
   </el-dialog>
 </template>
 <script setup>
-import { ref,reactive,computed,onMounted } from 'vue'
+import { ref,reactive,computed,watch} from 'vue'
 import { validate } from '../api/survey'
 import { useStore } from 'vuex'
 import { ElMessage } from 'element-plus'
@@ -83,9 +83,11 @@ const handleSubmit = async() => {
     return
   }
   whiteVisible.value = false
+  store.commit('setVerifyId', res.data.verifyId)
 }
 
-onMounted(() => {
+watch(()=>baseConf.value, () => {
+  if (whiteVisible.value) return
   if(isValue.value || isPwd.value){
     whiteVisible.value = true;
   }
@@ -103,8 +105,8 @@ onMounted(() => {
     margin-bottom: 8px;
     margin-top:2px;
   }
-  .mt16{
-    margin-top:16px;
+  .mb16{
+    margin-bottom:16px;
   }
   .verify-white-tips{
     text-align: center;
@@ -130,7 +132,7 @@ onMounted(() => {
     display: flex;
     align-items: center;
     justify-content: center;
-    margin-top:20px;
+    margin-top:4px;
     margin-bottom:14px;
   }
 }

web/src/render/pages/RenderPage.vue

@@ -14,7 +14,7 @@
           @submit="handleSubmit"
         ></SubmitButton>
         <LogoIcon :logo-conf="logoConf" :readonly="true" />
-        <VerifyWhiteDialog v-if="store.state?.bannerConf" />
+        <VerifyWhiteDialog />
       </div>
     </div>
   </div>
@@ -65,6 +65,7 @@ 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 verifyId = computed(() => store.state?.verifyId || '')
 
 const validate = (cbk: (v: boolean) => void) => {
   const index = 0
@@ -83,6 +84,10 @@ const normalizationRequestBody = () => {
     clientTime: Date.now()
   }
 
+  if(verifyId.value){
+    result.verifyId = verifyId.value
+  }
+
   if (encryptInfo?.encryptType) {
     result.encryptType = encryptInfo?.encryptType
     result.data = encrypt[result.encryptType as 'rsa']({

web/src/render/store/mutations.js

@@ -49,5 +49,8 @@ export default {
   },
   setRuleEgine(state, ruleEngine) {
     state.ruleEngine = ruleEngine
+  },
+  setVerifyId(state, verifyId) {
+    state.verifyId = verifyId
   }
 }

web/src/render/store/state.js

@@ -12,5 +12,6 @@ export default {
   questionSeq: [], // 题目的顺序，因为可能会有分页的情况，所以是一个二维数组[[qid1, qid2], [qid3,qid4]]
   voteMap: {},
   encryptInfo: null,
-  ruleEngine: null
+  ruleEngine: null,
+  verifyId:''
 }