瀏覽代碼

fext:1.新增个人中心的游记发布

suwenjiang 3 月之前
父節點
當前提交
1d5744c66b

+ 60 - 0
src/components/Profile/Notes/Published/Item.vue

@@ -0,0 +1,60 @@
+<template>
+  <!-- <div
+    class="group relative flex space-x-15 px-10 py-20 transition-all hover:bg-[#f8f8f8]"
+  > -->
+  <!-- <img
+      :src="formatImgSrc(data.tourismUrlsAfterConvert) || noteDraftCoverBg"
+      class="aspect-[4/3] h-180 shrink-0 rounded-xl object-cover"
+    />
+    <div class="flex-1">
+      <div class="min-h-140">
+        <NuxtLink
+          :to="`/yj/${data.id}`"
+          class="cursor-pointer truncate break-all text-2xl font-bold text-black-3 transition-all hover:text-primary"
+        >
+          {{ data.projectTitle }}
+        </NuxtLink>
+        <div class="mt-10 line-clamp-3 break-all text-base text-black-6">
+          {{ data.remarks }}
+        </div>
+      </div>
+      <div class="flex space-x-20 text-base text-black-6">
+        <div class="flex items-center space-x-2">
+          <span
+            class="iconfont icon-eye-fill text-black-9"
+            style="font-size: 16px"
+          ></span>
+          <div>{{ data.pageViewCount ?? 0 }}</div>
+        </div>
+        <div v-if="data.endPlaceDictMap" class="flex items-center space-x-2">
+          <span
+            class="iconfont icon-location-fill text-black-9"
+            style="font-size: 16px"
+          ></span>
+          <div>{{ data.endPlaceDictMap?.name }}</div>
+        </div>
+      </div>
+    </div>
+    <div
+      @click="$emit('onNoteDown')"
+      class="absolute bottom-20 right-20 hidden cursor-pointer items-center space-x-5 rounded border border-[#f0f2f5] px-20 py-5 text-sm text-primary hover:bg-primary hover:text-white group-hover:flex"
+    >
+      下架
+    </div> -->
+  <!-- </div> -->
+</template>
+
+<script setup>
+// import noteDraftCoverBg from '~/assets/img/note-create/note_draft_cover_bg.jpg'
+
+// const props = defineProps({
+//   data: {
+//     type: Object,
+//     default: () => ({})
+//   }
+// })
+
+// defineEmits(['onNoteDown'])
+</script>
+
+<style lang="scss" scoped></style>

+ 62 - 0
src/components/Profile/Notes/Published/index.vue

@@ -0,0 +1,62 @@
+<template>
+  <!-- v-loading="loading" -->
+  <div class="box-border min-h-400 pt-17 px-1">
+    发布页面
+    <!-- <ProfileNotesEmpty v-if="!loading && !noteList.length" /> -->
+    <!-- <div v-else-if="noteList.length">
+      <div class="mt-10 flex flex-col divide-y">
+        <ProfileNotesPublishedItem
+          v-for="item in noteList"
+          :key="item.id"
+          :data="item"
+          @on-note-down="handleNoteDown(item)"
+        />
+      </div>
+    </div> -->
+  </div>
+</template>
+
+<script setup>
+// const { loading, setLoading } = useLoading()
+// loading.value = true
+
+const noteList = ref([])
+
+async function getList() {
+  // setLoading(true)
+  try {
+    const { data } = await request('/website/tourism/publishTravelNotes/getDraftList', {
+      query: {
+        pageNum: 1,
+        pageSize: 10000,
+        type: 3
+      }
+    })
+    noteList.value = data.dataList
+  } finally {
+    // setLoading(false)
+  }
+}
+
+// 下架
+// async function handleNoteDown(item) {
+//   ElMessageBox.confirm('下架后游记将存入草稿,确定下架吗?', '提示', {}).then(async () => {
+//     try {
+//       await request(`/website/tourism/publishTravelNotes/delist`, {
+//         method: 'post',
+//         body: {
+//           writeId: item.id
+//         }
+//       })
+//       ElMessage.success('下架成功')
+//       getList()
+//     } catch (error) {}
+//   })
+// }
+
+onMounted(() => {
+  // getList()
+})
+</script>
+
+<style lang="scss" scoped></style>

+ 38 - 0
src/components/Profile/Notes/Tabs.vue

@@ -0,0 +1,38 @@
+<template>
+  <div>
+    <div class="flex items-center space-x-7">
+      <div
+        v-for="tab in tabs"
+        :key="tab.lable"
+        @click="handleClick(tab)"
+        class="flex w-78 h-34 text-14 cursor-pointer items-center justify-center rounded-full text-base transition-all"
+        :class="[
+          currentTab == tab.name ? 'bg-primary text-white font-bold' : 'bg-yellow text-black-3'
+        ]"
+      >
+        {{ tab.lable }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  tabs: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const currentTab = useRouteQuery('tab')
+
+function handleClick(tab) {
+  navigateTo({
+    query: {
+      tab: tab.name
+    }
+  })
+}
+</script>
+
+<style lang="scss" scoped></style>

+ 6 - 0
src/pages/note-create-start/index.vue

@@ -0,0 +1,6 @@
+<template>
+  <div>开始写游记</div>
+</template>
+
+<script setup></script>
+<style lang="scss" scoped></style>

+ 65 - 0
src/pages/profile/index/notes.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="box-border py-16 px-20">
+    <ProfileNotesTabs :tabs="tabs"></ProfileNotesTabs>
+    <div class="mt-20">
+      <div v-if="tab === 'published'">
+        <ProfileNotesPublished />
+      </div>
+      <div v-else-if="tab === 'auditing'">
+        <!-- <ProfileNotesAuditing /> -->
+      </div>
+      <div v-else-if="tab === 'rejected'">
+        <!-- <ProfileNotesRejected /> -->
+      </div>
+      <div v-else-if="tab === 'draft'">
+        <!-- <ProfileNotesDraft /> -->
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const tabs = [
+  {
+    lable: '已发布',
+    name: 'published',
+    to: ''
+  },
+  {
+    lable: '审核中',
+    name: 'auditing',
+    to: ''
+  },
+  {
+    lable: '未通过',
+    name: 'rejected',
+    to: ''
+  },
+  {
+    lable: '草稿箱',
+    name: 'draft',
+    to: ''
+  }
+]
+
+const route = useRoute()
+
+const tab = useRouteQuery('tab')
+
+watch(
+  tab,
+  (val) => {
+    if (val) return
+    navigateTo({
+      path: route.fullPath,
+      query: {
+        tab: tabs[0].name
+      },
+      replace: true
+    })
+  },
+  { immediate: true }
+)
+</script>
+
+<style lang="scss" scoped></style>