From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目

---
 src/views/mp/draft/components/DraftTable.vue |   87 +++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 87 insertions(+), 0 deletions(-)

diff --git a/src/views/mp/draft/components/DraftTable.vue b/src/views/mp/draft/components/DraftTable.vue
new file mode 100644
index 0000000..b0f4fa0
--- /dev/null
+++ b/src/views/mp/draft/components/DraftTable.vue
@@ -0,0 +1,87 @@
+<template>
+  <div class="waterfall" v-loading="props.loading">
+    <template v-for="(item, index) in props.list" :key="index">
+      <div class="waterfall-item" v-if="item.content && item.content.newsItem">
+        <WxNews :articles="item.content.newsItem" />
+        <!-- 鎿嶄綔鎸夐挳 -->
+        <el-row>
+          <el-button
+            type="success"
+            circle
+            @click="emit('publish', item)"
+            v-hasPermi="['mp:free-publish:submit']"
+          >
+            <Icon icon="fa:upload" />
+          </el-button>
+          <el-button
+            type="primary"
+            circle
+            @click="emit('update', item)"
+            v-hasPermi="['mp:draft:update']"
+          >
+            <Icon icon="ep:edit" />
+          </el-button>
+          <el-button
+            type="danger"
+            circle
+            @click="emit('delete', item)"
+            v-hasPermi="['mp:draft:delete']"
+          >
+            <Icon icon="ep:delete" />
+          </el-button>
+        </el-row>
+      </div>
+    </template>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import WxNews from '@/views/mp/components/wx-news'
+
+import { Article } from './types'
+
+const props = defineProps<{
+  list: Article[]
+  loading: boolean
+}>()
+
+const emit = defineEmits<{
+  (e: 'publish', v: Article)
+  (e: 'update', v: Article)
+  (e: 'delete', v: Article)
+}>()
+</script>
+
+<style lang="scss" scoped>
+.waterfall {
+  width: 100%;
+  column-gap: 10px;
+  column-count: 5;
+  margin: 0 auto;
+
+  .waterfall-item {
+    padding: 10px;
+    margin-bottom: 10px;
+    break-inside: avoid;
+    border: 1px solid #eaeaea;
+  }
+}
+
+@media (width >= 992px) and (width <= 1300px) {
+  .waterfall {
+    column-count: 3;
+  }
+}
+
+@media (width >= 768px) and (width <= 991px) {
+  .waterfall {
+    column-count: 2;
+  }
+}
+
+@media (width <= 767px) {
+  .waterfall {
+    column-count: 1;
+  }
+}
+</style>

--
Gitblit v1.8.0