feat:新增打分题

.vscode/settings.json

@@ -1,6 +1,6 @@
 {
   "explorer.confirmDelete": false,
-  "editor.fontSize": 18,
+  "editor.fontSize": 16,
   "workbench.editorAssociations": {
     "*.ipynb": "jupyter.notebook.ipynb"
   },

components.d.ts

@@ -14,11 +14,11 @@ declare module 'vue' {
     VanCellGroup: typeof import('vant/es')['CellGroup']
     VanCheckbox: typeof import('vant/es')['Checkbox']
     VanCheckboxGroup: typeof import('vant/es')['CheckboxGroup']
-    VanDialog: typeof import('vant/es')['Dialog']
     VanDivider: typeof import('vant/es')['Divider']
     VanField: typeof import('vant/es')['Field']
     VanIcon: typeof import('vant/es')['Icon']
     VanPopup: typeof import('vant/es')['Popup']
+    VanRate: typeof import('vant/es')['Rate']
     VanSearch: typeof import('vant/es')['Search']
     VanSwitch: typeof import('vant/es')['Switch']
     VanTabbar: typeof import('vant/es')['Tabbar']

src/fonts/demo.css

@@ -4,11 +4,11 @@
   src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
   src:
     url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix')
-      format('embedded-opentype'),
+    format('embedded-opentype'),
     url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
     url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
     url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont')
-      format('svg');
+    format('svg');
 }
 
 .logo {

src/stores/modules/common.ts

@@ -469,6 +469,167 @@ export const useCommonStore = defineStore('common', {
           planet_id: '',
           permissions: null
         },
+        {
+          id: '17852489',
+          title: 'Q3',
+          stem: '<p>请打分</p>',
+          other: '',
+          question_index: 3,
+          question_type: 5,
+          config: {
+            min: 1.0,
+            max: 5.0,
+            is_required: 1,
+            score_type: 0,
+            score_way: 0,
+            score_interval: 1.0,
+            prompt_score: 2,
+            prompt_array: null,
+            prompt_left: '',
+            prompt_right: '',
+            prompt_center: '',
+            select_random: 0,
+            float_window: 0,
+            float_window_content: '',
+            popup_window: 0,
+            popup_window_content: '',
+            is_show: [],
+            quick_type: 0
+          },
+          created_at: '2025-03-05T09:47:02',
+          created_user_id: 1281,
+          updated_user_id: null,
+          survey_id: 9482,
+          logic_config: {
+            expect: '',
+            order: 0,
+            type: 0,
+            stay_time: ''
+          },
+          options: [
+            [{
+              option: '<p>选项1</p>',
+              id: '1049106',
+              type: 0,
+              is_other: 0,
+              is_fixed: 0,
+              is_remove_other: 0,
+              created_at: null,
+              created_user_id: null,
+              parent_id: null,
+              option_index: 1,
+              list_id: 74455,
+              option_code: '',
+              option_config: {
+                title: '',
+                instructions: [],
+                price: 0.0,
+                gradient: '',
+                image_url: [],
+                option_type: 0,
+                type: 0,
+                limit_right_content: '',
+                child_area: null,
+                binding_goods_id: ''
+              },
+              disable_option_update: null,
+              cascade: []
+            },
+            {
+              option: '<p>选项2</p>',
+              id: '1049107',
+              type: 0,
+              is_other: 0,
+              is_fixed: 0,
+              is_remove_other: 0,
+              created_at: null,
+              created_user_id: null,
+              parent_id: null,
+              option_index: 2,
+              list_id: 74455,
+              option_code: '',
+              option_config: {
+                title: '',
+                instructions: [],
+                price: 0.0,
+                gradient: '',
+                image_url: [],
+                option_type: 0,
+                type: 0,
+                limit_right_content: '',
+                child_area: null,
+                binding_goods_id: ''
+              },
+              disable_option_update: null,
+              cascade: []
+            },
+            {
+              option: '<p>选项3</p>',
+              id: '1049108',
+              type: 0,
+              is_other: 0,
+              is_fixed: 0,
+              is_remove_other: 0,
+              created_at: null,
+              created_user_id: null,
+              parent_id: null,
+              option_index: 3,
+              list_id: 74455,
+              option_code: '',
+              option_config: {
+                title: '',
+                instructions: [],
+                price: 0.0,
+                gradient: '',
+                image_url: [],
+                option_type: 0,
+                type: 0,
+                limit_right_content: '',
+                child_area: null,
+                binding_goods_id: ''
+              },
+              disable_option_update: null,
+              cascade: []
+            },
+            {
+              option: '<p>选项4</p>',
+              id: '1049171',
+              type: 0,
+              is_other: 0,
+              is_fixed: 0,
+              is_remove_other: 0,
+              created_at: null,
+              created_user_id: null,
+              parent_id: null,
+              option_index: 4,
+              list_id: 74455,
+              option_code: '',
+              option_config: {
+                title: '',
+                instructions: [],
+                price: 0.0,
+                gradient: '',
+                image_url: [],
+                option_type: 0,
+                type: 0,
+                limit_right_content: '',
+                child_area: null,
+                binding_goods_id: ''
+              },
+              disable_option_update: null,
+              cascade: []
+            }
+            ]
+          ],
+          associate: [],
+          logics_has: null,
+          last_option_index: 4,
+          question_code: '',
+          question_value: '',
+          question_tag: '',
+          planet_id: '',
+          permissions: null
+        },
         {
           id: '17852298',
           title: 'Q4',

src/views/Design/Index.vue

@@ -16,17 +16,27 @@
           :chooseQuestionId="chooseQuestionId"
           @get-choose-question-id="getChooseQuestionId"
         >
+          <!-- 选择题 -->
           <base-select
             v-if="element.question_type === 1"
             :element="element"
             :active="chooseQuestionId === element.id"
           ></base-select>
+          <!-- 填空题 -->
           <Completion
             v-if="element.question_type === 4"
             :element="element"
             :active="chooseQuestionId === element.id"
             sn="lXEBBpE2"
           ></Completion>
+          <!-- 打分题 -->
+          <Rate
+            v-if="element.question_type === 5"
+            :element="element"
+            :active="chooseQuestionId === element.id"
+            sn="lXEBBpE2"
+          />
+          <!-- @update="updateHandle" -->
         </choose-question>
 
         <!--        {{ element.question_type }}-->
@@ -51,6 +61,7 @@ import BaseSelect from './components/Questions/BaseSelect.vue';
 import ChooseQuestion from './components/ChooseQuestion.vue';
 import Paging from './components/Questions/paging/Paging.vue';
 import Completion from './components/Questions/Completion.vue';
+import Rate from './components/Questions/Rate.vue';
 
 const activeIndex = ref(-1);
 /**

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

@@ -58,7 +58,7 @@
     round
     :style="{ minHeight: '60%' }"
   >
-    <template v-for="(item, index) in logics" :key="index">
+    <template v-for="(item, logicIndex) in logics" :key="logicIndex">
       <div
         v-if="item.skip_type === skipType && item.question_index === activeQuestion.question_index"
         class="mv10 question-setting"
@@ -162,8 +162,8 @@ const getSkipTypeText = (skipType) => {
   const ls = [];
   logics.map((item) => {
     if (
-      item.skip_type === skipType
+      item.skip_type === skipType &&
-      && item.question_index === activeQuestion.value.question_index
+      item.question_index === activeQuestion.value.question_index
     ) {
       ls.push(item);
     }
@@ -179,13 +179,13 @@ const getSkipTypeText = (skipType) => {
 
 const questionSetting = (type) => {
   switch (type) {
-  case 'before':
+    case 'before':
-    questionBeforeShow.value = true;
+      questionBeforeShow.value = true;
 
-    break;
+      break;
-  case 'after':
+    case 'after':
-    questionBeforeShow.value = true;
+      questionBeforeShow.value = true;
-    break;
+      break;
   }
   skipType.value = type === 'before' ? 0 : 1;
 };

src/views/Design/components/ChooseQuestion.vue

@@ -8,7 +8,7 @@
       <slot></slot>
       <!--      题目操作-->
       <van-cell v-if="chooseQuestionId === element.id" class="choose-question-active-container">
-        <template v-if="element.question_type === 1" #icon>
+        <template v-if="element.question_type === 1 || element.question_type === 5" #icon>
           <div class="flex align-center" @click="radioAddOption">
             <van-icon name="add" class="fs20"></van-icon>
             <span class="ml10">添加选项</span>

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

@@ -0,0 +1,150 @@
+<template>
+  <div class="content">
+    <van-field
+      v-model="element.stem"
+      :label="element.stem"
+      :required="element.config.is_required === 1"
+      label-align="top"
+    >
+      <template #label>
+        <div
+          :contenteditable="active"
+          class="van-field"
+          @blur="saveStem($event, element)"
+          v-html="element.stem"
+        ></div>
+      </template>
+      <template #input>
+        <div v-for="(optionItem, optionItemIndex) in element.options" :key="optionItemIndex">
+          <div v-for="(item, index) in optionItem" :key="index" @click="chooseOption(item)">
+            <div
+              :contenteditable="item.id === chooseId"
+              class="van-field"
+              v-html="item.option"
+            ></div>
+            <ul>
+              <li
+                v-for="(rate, rateIndex) in rateItem"
+                :key="rateIndex"
+                class="rate_item"
+                :class="{ active_item: rate.active }"
+                @click="getItem(rate)"
+              >
+                {{ rate.label }}
+              </li>
+            </ul>
+          </div>
+        </div>
+      </template>
+    </van-field>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+const rateItem = ref([
+  {
+    label: 1,
+    active: false
+  },
+  {
+    label: 2,
+    active: false
+  },
+  {
+    label: 3,
+    active: false
+  },
+  {
+    label: 4,
+    active: false
+  },
+  {
+    label: 5,
+    active: false
+  },
+  {
+    label: 6,
+    active: false
+  },
+  {
+    label: 7,
+    active: false
+  },
+  {
+    label: 8,
+    active: false
+  },
+  {
+    label: 9,
+    active: false
+  },
+  {
+    label: 10,
+    active: false
+  }
+]);
+const props = defineProps({
+  element: {
+    type: Object,
+    default: () => {
+      // 补充
+    }
+  },
+  active: {
+    type: Boolean,
+    default: false
+  },
+  sn: { type: String, default: '' },
+  questionType: { type: [String, Number], default: 4 }
+});
+const element = ref(props.element);
+const chooseId = ref('');
+// 创建一个本地副本以保存更改
+const localElement = ref({ ...props.element });
+
+const saveStem = (e) => {
+  localElement.value.stem = e.target.innerHTML;
+  // 如果需要，可以在这里发出事件以通知父组件
+  // this.$emit('update:element', localElement.value);
+};
+
+const chooseOption = (item) => {
+  console.log(item);
+  chooseId.value = item.id;
+};
+const getItem = (value) => {
+  chooseId.value = value.id;
+  rateItem.value.forEach((item, index) => {
+    rateItem.value[index].active = item.label <= value.label;
+  });
+};
+</script>
+
+<style scoped lang="scss">
+.content {
+  background-color: #fff;
+
+  ul {
+    // border: 1px solid red;
+    display: flex;
+    margin-bottom: 10px;
+  }
+
+  .rate_item {
+    margin: 0 3px;
+    margin-top: 5px;
+    padding: 0 8px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    color: #666;
+
+    // border: 1px solid red;
+  }
+
+  .active_item {
+    background-color: #70b936;
+    color: #fff;
+  }
+}
+</style>

src/views/Survey/views/Create/Index.vue

@@ -39,7 +39,8 @@
     </van-cell-group>
 
     <!-- 底部功能性按钮 -->
-    <div style="
+    <div
+      style="
         position: fixed;
         bottom: 0;
         display: flex;
@@ -49,7 +50,8 @@
         width: 100%;
         height: 50px;
         background-color: white;
-      ">
+      "
+    >
       <div>设置</div>
       <div style="display: flex; flex-direction: row; justify-content: space-around; width: 60%">
         <button size="small">预览</button>

src/views/Survey/views/Publish/Index.vue

@@ -8,9 +8,11 @@
 
     <van-cell-group inset style="margin-top: 20px;padding: 30px;">
       <div>
-        <img width="100%"
+        <img
+          width="100%"
           src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u14.jpg?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
-          alt="" />
+          alt=""
+        />
       </div>
       <div class="qrcode">
         <img src="" alt="" width="100px" height="100px" />
@@ -22,16 +24,18 @@
       <div>移动端仅做数据回收，问卷数据分析请前往PC端浏览</div>
       <div class="operation">
         <span v-for="item in 2" :key="item">
-          <img width="30px"
+          <img
-            src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333" />
+            width="30px"
-
+            src="https://files.axshare.com/gsc/DR6075/44/1a/03/441a03a8b1004755a7a392b311acf97f/images/%E6%8A%95%E6%94%BE/u21.png?pageId=2f9ba10c-92b8-4c9b-b40b-04e65a0b4333"
+          />
 
           复制链接
         </span>
       </div>
     </van-cell-group>
     <!-- 底部功能性按钮 -->
-    <div style="
+    <div
+      style="
         position: fixed;
         bottom: 0;
         display: flex;
@@ -41,7 +45,8 @@
         width: 100%;
         height: 50px;
         background-color: white;
-      ">
+      "
+    >
       <van-button block>取消</van-button>
     </div>
   </div>