feat: 新增公告页面

src/pages/info-publish/announce-notice.vue

@@ -0,0 +1,170 @@
+<route lang="json5" type="page">
+{
+  layout: 'default',
+  style: {
+    navigationStyle: 'custom'
+  }
+}
+</route>
+
+<template>
+  <TopNavigation title="新增公告"></TopNavigation>
+  <div class="announce-notice">
+    <!-- 表单内容 -->
+    <div class="form-content">
+      <div class="form-item">
+        <div class="label">
+          <span class="required">*</span>
+          公告标题
+        </div>
+        <input
+          type="text"
+          v-model="formData.title"
+          placeholder="请输入公告标题"
+          class="input-field"
+        />
+      </div>
+
+      <div class="form-item">
+        <div class="label">
+          <span class="required">*</span>
+          公告正文
+        </div>
+        <textarea
+          v-model="formData.content"
+          placeholder="请输入要发布的内容"
+          class="textarea-field"
+          @input="handleContentInput"
+        ></textarea>
+        <div class="word-count">{{ contentLength }}/2000</div>
+      </div>
+    </div>
+
+    <!-- 底部按钮 -->
+    <div class="bottom-button">
+      <button class="next-step" @click="handleNextStep">下一步</button>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'AnnounceNotice',
+    data() {
+      return {
+        formData: {
+          title: '',
+          content: ''
+        }
+      }
+    },
+    computed: {
+      contentLength() {
+        return this.formData.content.length
+      }
+    },
+    methods: {
+      goBack() {
+        this.$router.back()
+      },
+      handleContentInput() {
+        if (this.formData.content.length > 2000) {
+          this.formData.content = this.formData.content.slice(0, 2000)
+        }
+      },
+      handleNextStep() {
+        if (!this.formData.title) {
+          this.$toast('请输入公告标题')
+          return
+        }
+        if (!this.formData.content) {
+          this.$toast('请输入公告内容')
+        }
+        // TODO: 处理下一步逻辑
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .announce-notice {
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    background: #f5f5f5;
+  }
+
+  .header {
+    position: relative;
+    display: flex;
+    align-items: center;
+    height: 44px;
+    padding: 0 15px;
+    background: #fff;
+  }
+
+  .title {
+    flex: 1;
+    font-size: 17px;
+    font-weight: 500;
+    text-align: center;
+  }
+
+  .form-content {
+    flex: 1;
+    padding: 15px;
+  }
+
+  .form-item {
+    padding: 15px;
+    margin-bottom: 15px;
+    background: #fff;
+    border-radius: 8px;
+  }
+
+  .label {
+    margin-bottom: 10px;
+    font-size: 15px;
+  }
+
+  .required {
+    margin-right: 4px;
+    color: #ff4d4f;
+  }
+
+  .input-field {
+    width: 100%;
+    font-size: 14px;
+    border: none;
+  }
+
+  .textarea-field {
+    width: 100%;
+    min-height: 200px;
+    font-size: 14px;
+    resize: none;
+    border: none;
+  }
+
+  .word-count {
+    margin-top: 8px;
+    font-size: 12px;
+    color: #999;
+    text-align: right;
+  }
+
+  .bottom-button {
+    padding: 15px;
+    background: #ff4d4f;
+  }
+
+  .next-step {
+    width: 100%;
+    height: 44px;
+    font-size: 16px;
+    color: #fff;
+    background: #4080ff;
+    border: none;
+    border-radius: 16px;
+  }
+</style>

src/pages/info-publish/notice.vue

@@ -137,6 +137,9 @@
   // 处理发布公告按钮点击
   const handlePublish = () => {
     // 跳转到发布公告页面
+    uni.navigateTo({
+      url: '/pages/info-publish/announce-notice'
+    })
   }
 </script>