feat(设计): 优化问卷设计功能

- 调整完成式题目字数限制显示逻辑- 为 NPS 问卷添加内容编辑组件
- 优化文本加图片问卷的编辑功能
- 调整必答设置的显示逻辑
- 修复完成式题目的保存问题
- 优化 API 接口配置

.env.development

@@ -1,5 +1,5 @@
 # .env.development
-VITE_APP_BASEURL=http://192.168.8.165:15011/
+VITE_APP_BASEURL=https://yls-api-uat.dctest.digitalyili.com/
 VITE_APP_ENV=development
 VITE_APP_CURRENTMODE=dev
 VITE_APP_BASEOSS=https://diaoyan-files.automark.cc

src/views/Design/Index.vue

@@ -335,6 +335,9 @@ const actionFun = {
 
 // emit 事件
 const saveQueItem = (logics, questions, survey) => {
+  // questions.map((item, index) => {
+  //   item.title = index + 1;
+  // });
   saveQuestion({
     sn: route.query.sn,
     data: {

src/views/Design/components/ActionCompoents/QuestionAction.vue

@@ -11,7 +11,12 @@
       <div class="flex flex-start">操作选项</div>
     </template>
     <van-cell-group :border="false" class="ml10">
-      <van-cell title="此题必答" :border="false" label-align="left">
+      <van-cell
+        title="此题必答"
+        :border="false"
+        label-align="left"
+        v-if="![6].includes(activeQuestion.question_type)"
+      >
         <template #right-icon>
           <van-switch
             v-model="activeQuestion.config.is_required"
@@ -233,8 +238,8 @@ const getSkipTypeText = (skipType) => {
   const ls = [];
   logics.map((item) => {
     if (
-      item.skip_type === skipType
-      && item.question_index === activeQuestion.value.question_index
+      item.skip_type === skipType &&
+      item.question_index === activeQuestion.value.question_index
     ) {
       ls.push(item);
     }

src/views/Design/components/ActionCompoents/components/QuestionItemAction/CompletionQuestionAction.vue

@@ -63,6 +63,7 @@
           :active-value="1"
           :inactive-value="0"
           size="0.5rem"
+          @change="emit('saveOption')"
         ></van-switch>
       </template>
     </van-field>
@@ -71,7 +72,7 @@
 
   <van-cell
     v-if="![5, 6, 7].includes(actionQuestion.config.text_type)"
-    title="字数限制"
+    :title="`${[1, 2].includes(actionQuestion.config.text_type) ? '数值限制' : '字数限制'}`"
     :border="false"
     label-align="left"
   >
@@ -130,6 +131,7 @@
         v-model="actionQuestion.config.line_type"
         icon-size="0.4rem"
         direction="horizontal"
+        @change="emit('saveOption')"
       >
         <van-radio :name="0">单行</van-radio>
         <van-radio :name="1">多行</van-radio>
@@ -165,7 +167,7 @@
       label-align="left"
       input-align="right"
       class="action-field"
-      placeholder="不限"
+      placeholder=""
       @blur="emit('saveOption')"
       @update:model-value="
         (value) => {
@@ -239,6 +241,7 @@ const selectText = (textType) => {
 const confirm = ({ selectedValues }) => {
   actionQuestion.value.config.text_type = Number(selectedValues[0]);
   selectTextTypeModel.value = false;
+  emit('saveOption');
 };
 
 const actionQuestion = computed({

src/views/Design/components/Questions/Completion.vue

@@ -17,7 +17,11 @@
         ></contenteditable>
       </template>
       <template #input>
-        <div contenteditable="true" class="input other_input"></div>
+        <textarea
+          class="other_input"
+          :placeholder="element.config.placeholder"
+          :rows="element.config.line_height"
+        ></textarea>
       </template>
     </van-field>
   </div>
@@ -45,7 +49,6 @@ const props = defineProps({
 // 创建一个本地副本以保存更改
 const emit = defineEmits(['update:element']);
 const { element } = toRefs(props);
-
 const emitValue = () => {
   emit('update:element', element.value);
 };
@@ -55,7 +58,7 @@ const emitValue = () => {
 .cont {
   .other_input {
     width: 100%;
-    height: 40px;
+    min-height: 40px;
     margin-bottom: 10px;
     padding: 3px 5px;
     border: 1px solid #ccc;

src/views/Design/components/Questions/NPS.vue

@@ -10,12 +10,7 @@
         {{ index + 1 }}
       </template>
       <template #label>
-        <div
-          :contenteditable="active"
-          class="van-field"
-          @blur="saveStem($event, element)"
-          v-html="element.stem"
-        ></div>
+        <contenteditable :active="active" @blur="saveStem" v-model="element.stem"></contenteditable>
       </template>
       <template #input>
         <div v-for="(optionItem, optionItemIndex) in element.options" :key="optionItemIndex">
@@ -38,7 +33,7 @@
 </template>
 
 <script setup>
-import { ref } from 'vue';
+import { ref, toRefs } from 'vue';
 import RateCharacter from './RateCharacter.vue';
 
 const props = defineProps({
@@ -56,13 +51,11 @@ const props = defineProps({
   sn: { type: String, default: '' },
   questionType: { type: [String, Number], default: 4 }
 });
-const element = ref(props.element);
+const { element } = toRefs(props);
 const chooseId = ref('');
-// 创建一个本地副本以保存更改
-const localElement = ref({ ...props.element });
-
-const saveStem = (e) => {
-  localElement.value.stem = e.target.innerHTML;
+const emit = defineEmits(['update:element']);
+const saveStem = () => {
+  emit('update:element', element.value);
 };
 
 const chooseOption = (item) => {

src/views/Design/components/Questions/TextWithImages.vue

@@ -11,15 +11,18 @@
         {{ index + 1 }}
       </template>
       <template #label>
-        <contenteditable v-model="element.stem" :active="active"></contenteditable>
-        <!--        <div v-html="element.stem" v-else></div>-->
+        <contenteditable
+          v-model="element.stem"
+          :active="active"
+          @blur="emitValue"
+        ></contenteditable>
       </template>
     </van-field>
   </div>
 </template>
 <script setup>
 import contenteditable from '@/components/contenteditable.vue';
-import { ref } from 'vue';
+import { toRefs } from 'vue';
 const props = defineProps({
   element: {
     type: Object,
@@ -39,6 +42,11 @@ const props = defineProps({
   }
 });
 
-const element = ref(props.element);
+const { element } = toRefs(props);
+
+const emit = defineEmits(['update:element']);
+const emitValue = () => {
+  emit('update:element', element.value);
+};
 </script>
 <style scoped lang="scss"></style>