feat:修改投票

src/components/vote/CreateVote.vue

@@ -4,18 +4,20 @@
     <slot></slot>
   </div>
   <a-drawer
-      :visible="visible"
+    :visible="visible"
-      class="drawerStyle createvoteDrawer"
+    class="drawerStyle createvoteDrawer"
-      width="800"
+    width="800"
-      placement="right"
+    placement="right"
   >
     <div class="researchadd">
       <div class="header">
-        <div class="headerTitle">{{ options.length ? "编辑投票题干" : "创建投票题干" }}</div>
+        <div class="headerTitle">
+          {{ options.length ? "编辑投票题干" : "创建投票题干" }}
+        </div>
         <img
-            style="width: 29px; height: 29px; cursor: pointer"
+          style="width: 29px; height: 29px; cursor: pointer"
-            src="../../assets/images/basicinfo/close.png"
+          src="../../assets/images/basicinfo/close.png"
-            @click="closeDrawer"
+          @click="closeDrawer"
         />
       </div>
       <div class="main_left">
@@ -23,8 +25,8 @@
           <div class="signbox">
             <div class="sign">
               <img
-                  src="@/assets/images/coursewareManage/asterisk.png"
+                src="@/assets/images/coursewareManage/asterisk.png"
-                  alt="asterisk"
+                alt="asterisk"
               />
             </div>
             <span>创建题干：</span>
@@ -34,34 +36,35 @@
           </div>
         </div>
       </div>
-      <div v-for="(item, index) in formData" :key="index+Math.random()">
+      <div v-for="(item, index) in formData" :key="index + Math.random()">
-        <VoteQuestion v-if="!item.deleted" :item="item" :index="index" @del="itemDel"/>
+        <VoteQuestion
+          v-if="!item.deleted"
+          :item="item"
+          :index="index"
+          @del="itemDel"
+        />
       </div>
 
       <div class="footer">
         <div class="btn">
           <a-button
-              type="primary"
+            type="primary"
-              ghost
+            ghost
-              style="
+            style="width: 100px; height: 40px; border-radius: 8px"
-              width: 100px;
+            @click="closeDrawer"
-              height: 40px;
-              border-radius: 8px;
-            "
-              @click="closeDrawer"
           >
             取消
           </a-button>
           <a-button
-              type="primary"
+            type="primary"
-              style="
+            style="
               margin-left: 14px;
               width: 100px;
               height: 40px;
               border-radius: 8px;
               background-color: #4ea6ff;
             "
-              @click="confirm"
+            @click="confirm"
           >
             保存
           </a-button>
@@ -71,62 +74,80 @@
   </a-drawer>
 </template>
 <script setup>
-import {defineEmits, defineProps, ref, watch} from "vue";
+import { defineEmits, defineProps, ref, watch } from "vue";
 import VoteQuestion from "./VoteQuestion.vue";
-import {message} from "ant-design-vue";
+import { message } from "ant-design-vue";
 
 const props = defineProps({
-  options: []
+  options: [],
-})
+});
 
-const emit = defineEmits({})
+const emit = defineEmits({});
-const formData = ref(props.options && props.options.length ? [...props.options] : [{
+const formData = ref(
-  voteStemName: '',
+  props.options && props.options.length
-  optionDetailList: []
+    ? [...props.options]
-}])
+    : [
+        {
+          voteStemName: "",
+          optionDetailList: [],
+        },
+      ]
+);
 
-const visible = ref(false)
+const visible = ref(false);
 
-watch(() => props.options.length, () => {
+watch(
-  formData.value = props.options && props.options.length ? [...props.options] : [{
+  () => props.options.length,
-    voteStemName: '',
+  () => {
-    optionDetailList: []
+    formData.value =
-  }]
+      props.options && props.options.length
-})
+        ? [...props.options]
+        : [
+            {
+              voteStemName: "",
+              optionDetailList: [],
+            },
+          ];
+  }
+);
 
 function openDrawer() {
-  visible.value = true
+  visible.value = true;
 }
 
 const closeDrawer = () => {
-  visible.value = false
+  visible.value = false;
-  formData.value = props.options && props.options.length ? [...props.options] : [{
+  formData.value =
-    voteStemName: '',
+    props.options && props.options.length
-    optionDetailList: []
+      ? [...props.options]
-  }]
+      : [
+          {
+            voteStemName: "",
+            optionDetailList: [],
+          },
+        ];
 };
 
 async function confirm() {
-  console.log(formData.value)
+  console.log(formData.value);
-  if (formData.value.some(t => !t.voteStemName && !t.deleted)) {
+  if (formData.value.some((t) => !t.voteStemName && !t.deleted)) {
-    message.warning('请输入题干名称')
+    message.warning("请输入题干名称");
-    return
+    return;
   }
-  visible.value = false
+  visible.value = false;
-  emit('update:options', formData.value)
+  emit("update:options", formData.value);
 }
 
 function handleAdd() {
   formData.value.push({
-    voteStemName: '',
+    voteStemName: "",
-    optionDetailList: []
+    optionDetailList: [],
-  })
+  });
 }
 
 function itemDel(i) {
-  formData.value[i].deleted = true
+  formData.value[i].deleted = true;
 }
-
 </script>
 <style lang="scss">
 .researchadd {

src/components/vote/VoteQuestion.vue

@@ -4,39 +4,47 @@
   <div class="content">
     <div class="tagbox">
       <div class="deleteop" @click="handleDel">
-        <div><img src="../../assets/images/projectadd/delete.png"/></div>
+        <div><img src="../../assets/images/projectadd/delete.png" /></div>
-        <div class="del_text">删除选项</div>
+        <div class="del_text">删除题干</div>
       </div>
     </div>
     <div class="name">
       <div class="namebox">
-        <img class="nameimg" src="../../assets/images/basicinfo/asterisk.png"/>
+        <img class="nameimg" src="../../assets/images/basicinfo/asterisk.png" />
         <div class="inname">题干</div>
       </div>
       <div class="in">
         <a-input
-            v-model:value="formData.voteStemName"
+          v-model:value="formData.voteStemName"
-            placeholder="请输入题干名称"
+          placeholder="请输入题干名称"
-            show-count
+          show-count
-            :maxlength="20"
+          :maxlength="20"
-            style="border-radius: 8px"
+          style="border-radius: 8px"
         />
       </div>
     </div>
-    <div v-for="(item, index) in formData.optionDetailList" :key="index+Math.random()">
+    <div
-      <VoteQuestionItem v-if="!item.deleted" :item="item" :index="index" @del="delItem"/>
+      v-for="(item, index) in formData.optionDetailList"
+      :key="index + Math.random()"
+    >
+      <VoteQuestionItem
+        v-if="!item.deleted"
+        :item="item"
+        :index="index"
+        @del="delItem"
+      />
     </div>
     <div class="name">
       <div class="in" style="margin-left: 85px; margin-bottom: 20px">
         <a-button
-            type="primary"
+          type="primary"
-            style="
+          style="
             width: 100px;
             height: 40px;
             border-radius: 8px;
             background-color: #4ea6ff;
           "
-            @click="handleSingleAdd"
+          @click="handleSingleAdd"
         >
           添加选项
         </a-button>
@@ -45,34 +53,33 @@
   </div>
 </template>
 <script setup>
-import {defineEmits, defineProps, ref, watch} from "vue";
+import { defineEmits, defineProps, ref, watch } from "vue";
 import VoteQuestionItem from "./VoteQuestionItem.vue";
 
 const props = defineProps({
   index: Number,
-  item: {}
+  item: {},
-})
+});
 
-const emit = defineEmits(['del'])
+const emit = defineEmits(["del"]);
 
-const formData = ref(props.item)
+const formData = ref(props.item);
 
 watch(props, () => {
-  formData.value = props.item
+  formData.value = props.item;
-})
+});
 
 function handleSingleAdd() {
-  formData.value.optionDetailList.push({})
+  formData.value.optionDetailList.push({});
 }
 
 function delItem(i) {
-  formData.value.optionDetailList[i].deleted = true
+  formData.value.optionDetailList[i].deleted = true;
 }
 
 function handleDel() {
   emit("del", props.index);
 }
-
 </script>
 <style lang="scss">
 .researchadd {