style(css): 更新样式文件并添加新图标

- 更新 main.scss 和 public.scss，使用 @use 替代 @import
- 添加 upload 和 shanchu1 两个新图标
- 更新 iconfont.css 和相关文件以包含新图标

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

@@ -5,6 +5,7 @@
       :label="element.stem"
       :required="element.config.is_required === 1"
       label-align="top"
+      class="contenteditable-question-title"
     >
       <template #left-icon>
         {{ index + 1 }}
@@ -16,25 +17,24 @@
         <div
           v-for="(optionItem, optionItemIndex) in isPreview ? element.list : element.options"
           :key="optionItemIndex"
+          class="rate-content"
         >
           <div
             v-for="(item, optionIndex) in isPreview ? optionItem.options : optionItem"
             :key="optionIndex"
             @click="chooseOption(item)"
           >
-            <RateCharacter
-              v-model="rate"
-              :index="optionIndex"
-              :config="element.config"
-              @change="handleRateChange"
-            >
-            </RateCharacter>
-            <div class="tips">
+            <div class="tips mb5">
               <p>{{ element.config.prompt_left }}</p>
               <p>{{ element.config.prompt_center }}</p>
               <p>{{ element.config.prompt_right }}</p>
             </div>
-            <RateCharacter v-model="answerValue" :config="element.config"></RateCharacter>
+            <RateCharacter
+              v-model="answerValue"
+              :config="element.config"
+              :index="optionIndex"
+              @change="handleRateChange"
+            ></RateCharacter>
           </div>
         </div>
       </template>
@@ -43,14 +43,11 @@
 </template>
 
 <script setup>
-import { ref, toRefs } from 'vue';
+import { ref } from 'vue';
 import RateCharacter from './RateCharacter.vue';
 
 const isPreview = defineModel('isPreview', { default: false, type: Boolean });
 const props = defineProps({
-  element: {
-    type: Object
-  },
   index: {
     type: Number,
     default: 0
@@ -66,6 +63,14 @@ const props = defineProps({
 // answer 的答案以 矩阵形式存储， 例如 [4,7]，上层更新答案的时候也容易
 const rates = defineModel('rates', { default: [], type: Array });
 const rate = ref(0);
+const answerValue = ref();
+
+const element = defineModel('element', {
+  type: Object,
+  default: () => {
+    return {};
+  }
+});
 
 // 不知道的 BUG ，开始的时候不能重置颜色。 故如此
 setTimeout(() => {
@@ -92,7 +97,6 @@ function handleRateChange(index, rate) {
   localStorage.setItem(props.sn, rate.value);
 }
 
-const { element } = toRefs(props);
 const chooseId = ref('');
 const emit = defineEmits(['update:element']);
 const saveStem = () => {
@@ -107,11 +111,33 @@ const chooseOption = (item) => {
 <style scoped lang="scss">
 .content {
   background-color: #fff;
+
+  & .rate-content {
+    width: 100%;
+    margin-top: 12px;
+
+    & .rate-item {
+      margin-bottom: 8px;
+      padding: 11px 13px;
+      border: 1px solid #f4f4f4;
+      border-radius: 8px;
+      background: #fafbfc;
+    }
+  }
+}
+
+.mb10 {
+  margin-bottom: 10px;
+}
+
+.mb5 {
+  margin-bottom: 5px;
 }
 
 .tips {
   display: flex;
   justify-content: space-between;
   color: #b8b8b8;
+  font-size: 12px;
 }
 </style>