From b001d9e08ab15f4d4d30e9e38fdf41e907ca746b Mon Sep 17 00:00:00 2001
From: "du.meimei" <du.meimei@ebiz-digits.com>
Date: Wed, 5 Mar 2025 19:27:43 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E6=89=93=E5=88=86bug=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/stores/modules/common.ts                  | 56 ------------
 .../Design/components/Questions/Rate.vue      | 91 +------------------
 .../components/Questions/RateCharacter.vue    | 91 +++++++++++++++++++
 3 files changed, 95 insertions(+), 143 deletions(-)
 create mode 100644 src/views/Design/components/Questions/RateCharacter.vue

diff --git a/src/stores/modules/common.ts b/src/stores/modules/common.ts
index 536b5bb..659fadc 100644
--- a/src/stores/modules/common.ts
+++ b/src/stores/modules/common.ts
@@ -779,62 +779,6 @@ export const useCommonStore = defineStore('common', {
                 },
                 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: []
               }
             ]
           ],
diff --git a/src/views/Design/components/Questions/Rate.vue b/src/views/Design/components/Questions/Rate.vue
index 480ab3d..fae1b52 100644
--- a/src/views/Design/components/Questions/Rate.vue
+++ b/src/views/Design/components/Questions/Rate.vue
@@ -22,17 +22,7 @@
               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>
+            <RateCharacter></RateCharacter>
           </div>
         </div>
       </template>
@@ -42,54 +32,11 @@
 
 <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
-  }
-]);
+import RateCharacter from './RateCharacter.vue';
+
 const props = defineProps({
   element: {
-    type: Object,
-    default: () => {
-      // 补充
-    }
+    type: Object
   },
   active: {
     type: Boolean,
@@ -105,46 +52,16 @@ 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>
diff --git a/src/views/Design/components/Questions/RateCharacter.vue b/src/views/Design/components/Questions/RateCharacter.vue
new file mode 100644
index 0000000..5d1ad35
--- /dev/null
+++ b/src/views/Design/components/Questions/RateCharacter.vue
@@ -0,0 +1,91 @@
+<template>
+  <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>
+</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 getItem = (value) => {
+  // chooseId.value = value.id;
+  rateItem.value.forEach((item, index) => {
+    rateItem.value[index].active = item.label <= value.label;
+  });
+};
+</script>
+
+<style scoped lang="scss">
+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>