fix : 1.修改游记不能发布

src/components/Profile/Notes/Tabs.vue

@@ -2,6 +2,7 @@
   <van-tabs
     title-active-color="#FF9300"
     title-inactive-color="#333333"
+    :active="active"
     @click-tab="handleClick"
     style="--van-tabs-bottom-bar-color: #ff9300; --van-tabs-bottom-bar-width: 30px; width: 100%"
   >
@@ -18,6 +19,8 @@ const props = defineProps({
 })
 
 const currentTab = useRouteQuery('tab')
+// 下标
+const active = computed(() => props.tabs?.findIndex((item) => item?.name == currentTab.value))
 
 function handleClick({ title }) {
   let tab = props.tabs?.find((item) => item?.lable == title)

src/pages/note-create/index.client.vue

@@ -32,6 +32,8 @@
             ref="inputDiv"
             @click="handleInsertOrEditTitleIndex2"
             @input="handleInsertOrEditTitleText"
+            @focus="showExpandTextInput = true"
+            @blur="showExpandTextInput = false"
             v-html="noteJson?.tourTourismProjectTravelNotesWriteContentDto?.content"
           ></div>
           <!-- <div class="min-h-100 mx-12 my-16 w-full mb-20 text-sm">
@@ -80,7 +82,9 @@
           </div>
         </template>
       </div>
-      <div class="px-16 flex justify-start mb-12">
+      <div
+        :class="`${showExpandTextInput ? 'fixed bottom-0 left-0' : ''} px-16 flex justify-start mb-12`"
+      >
         <button
           v-for="(operate, i) in userControlsList"
           :key="operate?.title + i"
@@ -145,6 +149,7 @@
       </template>
 
       <div
+        v-if="!showExpandTextInput"
         class="fixed box-border px-16 pt-16 pb-31 shadow-[0_-4px_4px_0px_rgba(0,0,0,0.1)] bottom-0 left-0 w-full h-80 flex justify-between bg-white items-center"
       >
         <div class="flex justify-start items-center h-50">
@@ -249,15 +254,10 @@
         <div class="flex justify-end text-[#999] text-[12px]">
           {{ defaultNoteJson.createTime }}
         </div>
-        <div class="mt-10" v-for="con in defaultNoteJson.travelNotesContent" :key="con.id">
-          <template v-if="con.type == 'image'">
-            <img :src="con.content" class="w-[full] rounded-xl" alt="" />
-          </template>
-
-          <template v-else>
-            <div class="text-sm text-black-3" v-html="con.content"></div>
-          </template>
-        </div>
+        <div
+          class="mt-10 text-sm text-black-3"
+          v-html="defaultNoteJson.tourTourismProjectTravelNotesWriteContentDto.content"
+        ></div>
 
         <div class="text-sm text-black-6 py-12 mb-12 box-border border-b-[1px]">
           <span class="mr-8">出发时间{{ contentIsEmpty(defaultNoteJson?.departureTime) }}</span>
@@ -335,7 +335,6 @@
 </template>
 
 <script setup>
-import { useFileDialog } from '@vueuse/core'
 import upload from '~/assets/img/note-create/upload.svg'
 import draft from '~/assets/img/note-create/draft.svg'
 // import { VueDraggable } from 'vue-draggable-plus'
@@ -403,10 +402,6 @@ const userControlsList = ref([
   // }
 ])
 
-const { open, onChange } = useFileDialog({
-  accept: '.png,.png,.jpeg,.JPG,Png '
-})
-
 const { loading, setLoading } = useLoading()
 loading.value = false
 
@@ -418,10 +413,9 @@ const defaultSectionContent = {
   type: 'sectionContent',
   content: ''
 }
-const defaultSectionImage = {
-  type: 'image',
-  content: ''
-}
+
+const swipeItemIndex = ref(1)
+const inputDiv = ref(null)
 
 const defaultNoteJson = {
   travelNotesBanner: null,
@@ -452,11 +446,13 @@ const noteJson = reactive(defaultNoteJson)
 watch(noteJson, () => {}, { deep: true, immediate: true })
 
 const id = useRouteQuery('id')
+let currentMention2 = '' // 当前正在输入的 # 用户名
 
 watch(
   id,
   () => {
     getNoteDetail()
+    currentMention2 = ''
   },
   { immediate: true }
 )
@@ -495,14 +491,11 @@ async function getNoteDetail() {
     )
     const data = res.data ?? {}
 
-    Object.keys(noteJson).forEach((key) => {
-      noteJson[key] = data[key]
-      noteJson.imgUrls = data.imgUrls ?? []
-      noteJson.topics = data.topics ?? []
-      noteJson.mentions = data.mentions ?? []
-      noteJson.visibleRange = data.visibleRange ?? 0
-      noteJson.projectTitle = data.projectTitle ?? ''
-    })
+    for (let i in noteJson) {
+      if (data[i]) {
+        noteJson[i] = data[i]
+      }
+    }
 
     noteJson.tourTourismProjectTravelNotesWriteContentDto.content =
       data?.tourTourismProjectTravelNotesWriteContent?.content ?? ''
@@ -515,9 +508,8 @@ async function getNoteDetail() {
       noteJson.endPlaceId = data?.endPlaceDictMap?.id
       noteJson.endPlace = data?.endPlaceDictMap?.name
     }
-    // nextTick(() => {
-    //   console.log(noteJson, '789')
-    // })
+    console.log(noteJson, 'noteJson')
+
     setLoading(false)
   } catch (error) {
     setLoading(false)
@@ -551,14 +543,8 @@ function handleInsertOrEditProjectTitle(value) {
   }
 }
 
-let currentMention2 = '' // 当前正在输入的 # 用户名
-
 let cursorPosition = { offsetX: 0, offsetY: 0 } // 光标位置
-const mentionIndex = ref(0) //记录@光标的位置
-const mentionIndex2 = ref(0) //记录#光标的位置
-// const mentionOptions = ref([]) //艾特及提及
-// const mentionLoading = ref(false)
-// const valueContent = ref('')
+
 // 点击编辑或者新增段落标题，
 const eidContent = ref('') //记录艾特后输入的内容
 
@@ -574,6 +560,7 @@ function handleInsertOrEditTitleText(value) {
     lastAtSign = text.indexOf('@')
     lastAtSign2 = text.indexOf('#')
   } else {
+    currentMention2 = ''
     lastAtSign = -1
     lastAtSign2 = -1
   }
@@ -593,6 +580,10 @@ function handleInsertOrEditTitleText(value) {
     showTopicEit.value = userControlsList.value[0].fn
     getTopicList(userControlsList.value[0])
   }
+
+  // if (lastAtSign == -1 || lastAtSign2 == -1) {
+  //   noteJson.tourTourismProjectTravelNotesWriteContentDto.content = currentMention2
+  // }
 }
 
 /******************插入正文相关逻辑*******************/
@@ -604,6 +595,11 @@ async function handleSaveDraft() {
   try {
     parmas = { ...noteJson }
     parmas.endPlace = noteJson.endPlaceId
+
+    if (inputDiv.value.innerHTML) {
+      parmas.tourTourismProjectTravelNotesWriteContentDto.content = inputDiv.value.innerHTML
+    }
+
     await request('/website/tourism/publishTravelNotes/saveDraft', {
       method: 'post',
       body: {
@@ -624,6 +620,8 @@ const previewOptions = reactive({
 
 function handlePreview() {
   previewOptions.show = !previewOptions.show
+
+  noteJson.tourTourismProjectTravelNotesWriteContentDto.content = inputDiv.value.innerHTML
 }
 
 // 收集个人信息
@@ -701,6 +699,10 @@ async function requestPublish() {
       parmas.endPlace = noteJson.endPlaceId
     }
 
+    if (inputDiv.value.innerHTML) {
+      parmas.tourTourismProjectTravelNotesWriteContentDto.content = inputDiv.value.innerHTML
+    }
+
     await request('/website/tourism/publishTravelNotes/publishDraft', {
       method: 'post',
       body: {
@@ -716,9 +718,6 @@ async function requestPublish() {
   }
 }
 
-const swipeItemIndex = ref(1)
-const inputDiv = ref(null)
-
 // 获取话题的数组
 const topicList = ref([])
 // 艾特用户的数组
@@ -726,8 +725,6 @@ const eitList = ref([])
 const showTopicEit = ref(null)
 
 // 记录点击话题和@ 后的几个数字。
-const topicEitName = ref('')
-const checkboxRefs = ref([])
 const queryParmas = reactive({
   pageNum: 1,
   pageSize: 10,
@@ -784,9 +781,11 @@ const handleOperate = (operate) => {
         if (showTopicEit.value == TOPIC_TEXT) {
           showTopicEit.value = null
         } else {
-          noteJson.tourTourismProjectTravelNotesWriteContentDto.content += '#'
+          noteJson.tourTourismProjectTravelNotesWriteContentDto.content =
+            inputDiv.value.innerHTML + '#'
           showTopicEit.value = operate.fn
           getTopicList(operate)
+          // handleInsertOrEditTitleText(noteJson.tourTourismProjectTravelNotesWriteContentDto.content)
         }
         break
       case EIT_TEXT:
@@ -794,8 +793,10 @@ const handleOperate = (operate) => {
           showTopicEit.value = null
         } else {
           showTopicEit.value = operate.fn
-          noteJson.tourTourismProjectTravelNotesWriteContentDto.content += '@'
+          noteJson.tourTourismProjectTravelNotesWriteContentDto.content =
+            inputDiv.value.innerHTML + '@'
           getTopicList(operate)
+          // handleInsertOrEditTitleText(noteJson.tourTourismProjectTravelNotesWriteContentDto.content)
         }
 
         break
@@ -973,6 +974,7 @@ function contentIsEmpty(content) {
 ::v-deep .mention {
   color: #2c405b;
   font-weight: bold;
+  margin-left: 4px;
 }
 
 .ql-editor {